<template>
|
<view style="background: #F7F7F7;">
|
<view class="content">
|
<steps style="margin-bottom: 10rpx;" :active="0"></steps>
|
<view class="info">
|
<view class="title">个人信息</view>
|
<uv-form :labelStyle='lstyle' labelWidth="100" style="padding:0 36rpx;">
|
<uv-form-item label="姓名" prop="name" borderBottom>
|
<uv-input disabled disabledColor="none" v-model="userInfo.name" border="none" placeholder="请输入姓名"></uv-input>
|
</uv-form-item>
|
<uv-form-item label="身份证号" prop="idCard" borderBottom>
|
<uv-input maxlength="18" disabled disabledColor="none" type="idcard" v-model="userInfo.idCard" border="none" placeholder="请输入身份证号"></uv-input>
|
</uv-form-item>
|
<uv-form-item label="月收入" prop="monthlyIncomeStr" borderBottom @click="openMonthlyIncome">
|
<uv-input v-model="userInfo.monthlyIncomeStr" disabled border="none" disabledColor="none" placeholder=""></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
|
<uv-form-item label="家庭月收入" prop="familyMonthlyIncome" borderBottom>
|
<uv-input type="digit" v-model="userInfo.familyMonthlyIncome" border="none" disabledColor="none" placeholder="请输入家庭月收入"></uv-input>
|
|
</uv-form-item>
|
<uv-form-item label="居住省市" prop="liveCityStr" borderBottom @click="openPickerCity">
|
<uv-input v-model="userInfo.liveCityStr" disabled border="none" disabledColor="none" placeholder="请先选择省市"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
<uv-form-item label="居住区县" prop="areasStr" borderBottom @click="openAreas">
|
<uv-input maxlength="20" v-model="userInfo.areasStr" disabled border="none" disabledColor="none" placeholder="请先选择省市"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
<uv-form-item label="详细地址" prop="=address" borderBottom>
|
<uv-input v-model="userInfo.address" border="none" placeholder="请输入详细地址"></uv-input>
|
</uv-form-item>
|
<uv-form-item label="借款用途" prop="loanUsageStr" borderBottom @click="openLoanUsage">
|
<uv-input v-model="userInfo.loanUsageStr" disabled border="none" disabledColor="none" placeholder="请选择借款用途"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
<uv-form-item label="芝麻分" prop="aliCreditStr" borderBottom @click="openAliCredit">
|
<uv-input v-model="userInfo.aliCreditStr" disabled border="none" disabledColor="none"></uv-input>
|
<template v-slot:right>
|
<uv-icon name="arrow-down" size="12"></uv-icon>
|
</template>
|
</uv-form-item>
|
<uv-form-item label="资产信息" prop="houseStatusStr" @click="openAliCredit">
|
|
<template v-slot:label>
|
<view style="font-size: 28rpx;display: flex;flex-direction: row;color: rgb(37, 41, 56);font-weight: 800">资产信息 <text style="color:red;font-size: 28rpx;margin-left: 20rpx;">提高申请成功率（可多选）</text></view>
|
</template>
|
|
</uv-form-item>
|
|
<view style="display: flex;flex-direction: row;flex-wrap: wrap;">
|
<view
|
style="display: flex;flex-direction: row"
|
v-for="(item, index) in ASSET_INFOMATION"
|
:key="index"
|
class="scroll-view-item_H"
|
:class="{ active: handleClass(item.value) }"
|
@click="handleClick(item.value)"
|
>{{ item.text }}
|
</view>
|
</view>
|
|
|
|
</uv-form>
|
|
|
</view>
|
|
<view style="display: flex;flex-direction: row;margin-top: 20rpx;">
|
<uv-checkbox-group
|
v-model="protocolChecked">
|
<uv-checkbox size="14" :name="1">
|
<view style="display: flex;flex-direction: row;font-size: 24rpx">
|
我已阅读并同意<text class="protocol" @click="openAgreement">《平台服务协议》</text>
|
</view>
|
</uv-checkbox>
|
</uv-checkbox-group>
|
|
</view>
|
<uv-button
|
:disabled="loading"
|
|
:loading="loading"
|
color="linear-gradient(104deg, #6d89ff 0%, #2865f2 100%), linear-gradient(270deg, #4766fe 0%, #7d9fff 100%)"
|
shape="circle" type="primary" text="下一步" customStyle="margin-top: 54rpx;height:100rpx" @click="submit"></uv-button>
|
</view>
|
|
|
|
<pickerCity ref="pickerCity" @confirm="getValueCity"></pickerCity>
|
<areas v-if="showAreas" :cityCode="cityCode" ref="areasLi" @confirm="getValueAreas"></areas>
|
<aliCredit ref="aliCredit" @confirm="getValueAliCredit"></aliCredit>
|
<loanUsage ref="loanUsage" @confirm="getValueLoanUsage"></loanUsage>
|
<monthlyIncome ref="monthlyIncome" @confirm="getValueMonthlyIncome"></monthlyIncome>
|
<agreement ref="agreement"></agreement>
|
<sfkef></sfkef>
|
</view>
|
</template>
|
<script>
|
|
import debounce from '@/uni_modules/uv-ui-tools/libs/function/debounce.js';
|
import { ASSET_INFOMATION } from '@/common/constant'
|
import pickerCity from "@/components/picker/index.vue";
|
import areas from "@/components/picker/areas.vue";
|
import aliCredit from "@/components/picker/aliCredit.vue";
|
import loanUsage from "@/components/picker/loanUsage.vue";
|
import monthlyIncome from "@/components/picker/monthlyIncome.vue";
|
import steps from "@/components/steps/index.vue";
|
import agreement from "@/components/agreement/index.vue";
|
import sfkef from "@/components/sfkef/index.vue";
|
import {appAddBankCardInfo, applyLoanBasic, checkIdCardTwo,getCustomerInfo} from "@/api/modules/user";
|
export default {
|
components: {
|
steps,pickerCity,areas,aliCredit,loanUsage,monthlyIncome,agreement,sfkef
|
},
|
data() {
|
return {
|
ASSET_INFOMATION:ASSET_INFOMATION,
|
list: [],
|
handOpen:false,
|
loading:false,
|
protocolChecked:[1],
|
showAreas:false,
|
lstyle:{
|
color:'#252938',
|
fontSize:'28rpx',
|
fontWeight:'800'
|
},
|
userInfo: {
|
name: '',
|
idCard: '',
|
liveCity: '',
|
liveCityStr: '',
|
areas: '',
|
areasStr: '',
|
address: '',
|
loanUsage: '',
|
monthlyIncome: 3,
|
monthlyIncomeStr: '10000-30000',
|
familyMonthlyIncome: '1002',
|
aliCredit: 3,
|
aliCreditStr: '600-650分',
|
loanUsageStr: '',
|
houseStatus: [],
|
houseStatusStr: '',
|
},
|
switchVal: false,
|
cityCode:'',
|
cityBox:'',
|
areasBox:'',
|
aliCreditStrBox:'',
|
loanUsageStrBox:'',
|
monthlyIncomeBox:'',
|
|
}
|
},
|
onLoad(params) {
|
// this.userInfo.name = params.name;
|
// this.userInfo.idCard = params.idCard;
|
|
getCustomerInfo().then(res=>{
|
this.userInfo.name = res.name;
|
this.userInfo.idCard = res.idCard;
|
})
|
},
|
methods: {
|
openAgreement() {
|
this.$refs.agreement.open();
|
},
|
|
handleClick(value) {
|
if (this.userInfo.houseStatus.includes(value)) {
|
this.userInfo.houseStatus.splice(this.userInfo.houseStatus.indexOf(value), 1);
|
return;
|
}
|
this.userInfo.houseStatus.push(value);
|
},
|
handleClass(value){
|
if (this.userInfo.houseStatus.includes(value)) {
|
return 'active';
|
}
|
return
|
},
|
|
|
// 获取Picker的值
|
|
getValueCity(e){
|
this.cityBox = e;
|
this.userInfo.liveCityStr = `${e['value'][0]['title']} ${e['value'][1]['title']}`;
|
this.cityCode = `${e['value'][1]['code']}`;
|
this.userInfo.areas = '';
|
this.userInfo.areasStr = '';
|
|
},
|
getValueAreas(e){
|
this.userInfo.areasStr = e['value'][0].name
|
this.areasBox = e
|
},
|
getValueAliCredit(e){
|
this.userInfo.aliCreditStr = e['value'][0].text
|
this.aliCreditStrBox = e
|
},
|
getValueLoanUsage(e){
|
this.userInfo.loanUsageStr = e['value'][0].text
|
this.loanUsageStrBox = e
|
},
|
getValueMonthlyIncome(e){
|
this.userInfo.monthlyIncomeStr = e['value'][0].text
|
this.monthlyIncomeBox = e
|
},
|
async savaApplyLoanBasic(){
|
// 提取性别
|
let genderCode = this.userInfo.idCard.charAt(16)
|
let sex = genderCode % 2 === 0 ? '女' : '男'
|
let id = null
|
await applyLoanBasic({
|
phone: uni.getStorageSync('phone'),
|
address:this.userInfo.address,
|
birthday:this.userInfo.idCard.substring(6, 14),
|
name: this.userInfo.name,
|
familyMonthlyIncome: this.userInfo.familyMonthlyIncome,
|
idCard: this.userInfo.idCard,
|
monthlyIncome: this.userInfo.monthlyIncome,
|
sesame: this.userInfo.aliCredit,
|
sex: sex,
|
useOfLoan: this.userInfo.loanUsage,
|
|
// 居住省
|
liveProvince:this.cityBox['value'][0]['title'],
|
//城市
|
city:this.userInfo.liveCity,
|
cityName:this.cityBox['value'][1]['title'],
|
|
liveCity:this.cityBox['value'][1]['title'],
|
|
// 居住区县
|
|
liveArea: this.userInfo.areasStr,
|
liveAreaCode: this.userInfo.areas,
|
|
aliCredit: this.userInfo.aliCreditStr,
|
houseStatus: this.userInfo.houseStatusStr,
|
|
|
professionInfo:null,
|
maritalStatus:null,
|
livest:null,
|
email:null,
|
|
|
}).then(res=>{
|
console.log(res);
|
id = res
|
|
}).catch(err=>{
|
this.loading = false
|
})
|
let pro = {
|
bankCode: '123456',
|
bankName: '中国农业银行',
|
bankPhoneNo: '15289944589',
|
bankCardName: '张三',
|
cardNo: '12345615289944589',
|
phone:uni.getStorageSync('phone'),
|
verifyCode: '123456',
|
id:id,
|
}
|
await appAddBankCardInfo(pro).then(res=>{
|
uni.navigateTo({
|
url: '/pages/apply/steps-b'
|
})
|
uni.showToast({
|
title: '提交成功',
|
icon: 'none',
|
})
|
}).catch(err=>{
|
this.loading = false
|
})
|
},
|
|
// 提交
|
submit() {
|
|
|
if(!this.protocolChecked){
|
uni.showToast({
|
icon: 'none',
|
title: '请先阅读并同意《用户隐私协议》'
|
})
|
return
|
}
|
const tips = {
|
name: '姓名',
|
idCard: '身份证',
|
familyMonthlyIncome: '家庭月收入',
|
liveCity: '居住省市',
|
areas: '居住区县',
|
loanUsage: '借款用途',
|
}
|
for(let i of Object.keys(this.userInfo)){
|
if(i==='houseStatusStr' || i==='houseStatus'){
|
continue
|
} else {
|
if(this.userInfo[i] === ''){
|
uni.showToast({
|
icon: 'none',
|
title: `${tips[i]}不能为空`
|
})
|
return
|
}
|
}
|
}
|
this.loading = true
|
debounce(()=>{
|
checkIdCardTwo({idCard: this.userInfo.idCard, name: this.userInfo.name}).then(res=>{
|
this.savaApplyLoanBasic()
|
}).catch(err=>{
|
this.loading = false
|
})
|
})
|
|
|
},
|
|
|
|
// 打开Picker
|
openPickerCity(){
|
this.$refs.pickerCity.open();
|
},
|
openAreas() {
|
if(!this.cityBox){
|
uni.showToast({
|
icon: 'none',
|
title: '请先选择居住省市'
|
})
|
return
|
}
|
this.showAreas = true;
|
this.$nextTick(() => {
|
if (this.$refs.areasLi) {
|
this.$refs.areasLi.open();
|
if (this.cityCode !== null && this.cityCode !== undefined) {
|
this.$refs.areasLi.setCityCode(this.cityCode);
|
}
|
} else {
|
console.warn('Reference to areasLi not found');
|
}
|
});
|
},
|
openAliCredit(){
|
this.$refs.aliCredit.open()
|
this.$nextTick(()=>{
|
if(this.userInfo.aliCredit){
|
for(let i of this.$refs.aliCredit.$refs.aliCreditPicker.addressList){
|
if(i.text == this.userInfo.aliCredit){
|
|
this.$refs.aliCredit.$refs.aliCreditPicker.setIndexs([i.index])
|
this.userInfo.aliCredit = i.value
|
break
|
}
|
}
|
}
|
})
|
|
|
},
|
openLoanUsage(){
|
this.$refs.loanUsage.open()
|
|
},
|
openMonthlyIncome(){
|
this.$refs.monthlyIncome.open()
|
this.$nextTick(()=>{
|
if(this.userInfo.aliCredit){
|
for(let i of this.$refs.monthlyIncome.$refs.monthlyIncomePicker.addressList){
|
if(i.text == this.userInfo.aliCredit){
|
|
this.$refs.monthlyIncome.$refs.monthlyIncomePicker.setIndexs([i.index])
|
this.userInfo.aliCredit = i.value
|
break
|
}
|
}
|
}
|
})
|
}
|
|
},
|
watch:{
|
'aliCreditStrBox':{
|
handler(newVal,oldVal){
|
this.userInfo.aliCredit = newVal['value'][0].value
|
}
|
},
|
'loanUsageStrBox':{
|
handler(newVal,oldVal){
|
this.userInfo.loanUsage = newVal['value'][0].value
|
}
|
},
|
'monthlyIncomeBox':{
|
handler(newVal,oldVal){
|
this.userInfo.monthlyIncome = newVal['value'][0].value
|
}
|
},
|
'areasBox':{
|
handler(newVal,oldVal){
|
console.log(newVal);
|
this.userInfo.areas = newVal['value'][0].areaId
|
}
|
},
|
'cityBox':{
|
handler(newVal,oldVal){
|
this.userInfo.liveCity = newVal['value'][1]['code']
|
}
|
}
|
}
|
}
|
</script>
|
<style scoped lang="scss">
|
.content{
|
margin: 30rpx;
|
.info{
|
background: #fff;
|
border-radius: 16rpx;
|
padding-top: 40rpx;
|
.title{
|
font-size: 34rpx;
|
color: #252938;
|
font-weight: bold;
|
position: relative;
|
padding-left: 36rpx;
|
&:after{
|
content: '';
|
position: absolute;
|
bottom: -10rpx;
|
left: 0;
|
width: 6rpx;
|
height: 100%;
|
background: #2865F2;
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
}
|
}
|
}
|
}
|
|
.scroll-view_H {
|
}
|
|
.scroll-view-item_H {
|
display: inline-block;
|
text-align: center;
|
// width: 136rpx;
|
padding: 0 28rpx;
|
margin-bottom: 20rpx;
|
margin-right: 20rpx;
|
height: 70rpx;
|
line-height: 70rpx;
|
width: auto;
|
background: #edf0f7;
|
border-radius: 8px;
|
font-size: 24rpx;
|
color: #8b8d96;
|
|
&.active {
|
// background: #fe4a49;
|
background: #2865F2;
|
color: #fff;
|
}
|
}
|
.protocol{
|
|
font-size: 24rpx;color: #207ef5;
|
}
|
|
|
</style>
|
