Files
ebiz-h5/src/views/ebiz/agentEenter/AgentEenterBasicInfor.vue
2020-10-15 20:36:18 +08:00

748 lines
26 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div class="insured-info-container pb50 ">
<!-- 基本信息 -->
<van-cell-group>
<RsTop :active="['1']"></RsTop>
<p style="border-bottom: 1px solid #ebedf0" class=" fs15 fwb pl10 pv12">基本信息</p>
<van-field v-model="userInfo.name" label="姓名" name="姓名" placeholder="请输入" v-validate="'required|name'" maxlength="6" required clearable />
<select-radio :radios="sexRadio" label="性别" name="性别" v-validate="'required'" required :value.sync="userInfo.sex"></select-radio>
<FieldDatePicter
v-validate="'required'"
label="出生日期"
name="出生日期"
:value.sync="userInfo.birthday"
type="date"
:flag="true"
@confirm="onDateConfirm($event, '2')"
ref="birthday"
:maxDate="maxDate"
required
></FieldDatePicter>
<van-field
:value="userInfo.nativePlace | idToText('rsnativePlace')"
label="籍贯"
name="籍贯"
v-validate="'required'"
readonly
right-icon="arrow"
placeholder="请选择"
@click="toSelect('14')"
required
/>
<van-field
:value="userInfo.ethnic | idToText('nationType')"
label="民族"
name="民族"
v-validate="'required'"
readonly
right-icon="arrow"
placeholder="请选择"
@click="toSelect('1')"
required
/>
<!-- <van-field :value="census" label="户籍" name="户籍" v-validate="'required'" right-icon="arrow" placeholder="请选择" @click="censusShow = true" /> -->
<!-- <van-field v-model="userInfo.homeProvince" label="户口所在地" name="户口所在地" v-validate="'required'" placeholder="请输入" /> -->
<van-field
:value="userInfo.rgtAddress | idToText('rsnativePlace')"
label="户口所在地"
name="户口所在地"
v-validate="'required'"
readonly
right-icon="arrow"
placeholder="请选择"
@click="toSelect('10')"
maxlength="20"
required
/>
<!-- <van-field v-model="userInfo.title" label="职称" name="职称" v-validate="'required'" placeholder="请输入" required /> -->
<van-field v-model="userInfo.title" label="职称" name="职称" placeholder="请输入" />
<!-- <van-field
:value="userInfo.health | idToText('rshealthCondition')"
label="健康状况"
name="健康状况"
v-validate="'required'"
readonly
right-icon="arrow"
placeholder="请选择"
@click="toSelect('3')"
/> -->
<van-field
:value="userInfo.marriage | idToText('rsmarriage')"
label="婚姻状况"
name="婚姻状况"
v-validate="'required'"
readonly
right-icon="arrow"
placeholder="请选择"
@click="toSelect('4')"
required
/>
<van-field
:value="userInfo.political | idToText('rspoliticsStatus')"
label="政治面貌"
name="政治面貌"
v-validate="'required'"
readonly
right-icon="arrow"
placeholder="请选择"
@click="toSelect('5')"
required
/>
<van-field
:value="userInfo.degree | idToText('rsdegree')"
label="学历"
name="学历"
v-validate="'required'"
readonly
right-icon="arrow"
placeholder="请选择"
@click="toSelect('6')"
required
/>
<van-field v-model="userInfo.school" label="毕业院校" name="毕业院校" placeholder="请输入" v-validate="'required'" clearable required />
<van-field
v-model="userInfo.discipline"
label="所学专业"
name="所学专业"
placeholder="请输入"
v-validate="Number(userInfo.degree) == 11 || Number(userInfo.degree) == 10 || Number(userInfo.degree) <= 4 ? 'required' : ''"
clearable
/>
<!-- <van-field v-model="userInfo.discipline" label="所学专业" name="所学专业" placeholder="请输入" v-validate="'required'" required clearable /> -->
<van-field v-model="userInfo.mobile" label="手机" name="手机" required readonly />
<van-field :value="userInfo.idType | idToText('idType')" v-validate="'required'" label="证件类型" name="证件类型" required readonly />
<!-- <van-field v-model="userInfo.idNo" v-validate="'required|idNo'" maxlength="18" label="证件号码" name="证件号码" placeholder="请输入" clearable> -->
<van-field v-model="userInfo.idNo" label="证件号码" readonly>
<!-- <van-button v-if="userInfo.idType == 1" slot="button" size="small" type="danger" round @click="selectClick('3')">证件扫描</van-button> -->
</van-field>
<van-field v-model="userInfo.address" label="联系地址" name="联系地址" placeholder="请输入" v-validate="'required'" required clearable />
<!-- <van-field v-model="userInfo.zip" label="邮政编码" name="邮政编码" placeholder="请输入" v-validate="'required|zipCode'" required clearable /> -->
<van-field v-model="userInfo.zip" label="邮政编码" name="邮政编码" placeholder="请输入" v-validate="'zipCode'" clearable />
<van-field
placeholder="请选择"
@click="islistShow = true"
v-model="bankName"
label="开户银行"
name="开户银行"
v-validate="'required'"
required
readonly
/>
<!-- @click="focus"
right-icon="arrow"
data-vv-name="开户银行" -->
<!-- <van-field v-model="userInfo.bankName" label="开户银行" name="开户银行" placeholder="请输入" v-validate="'required'" /> -->
<!-- <van-field v-model="bank" label="开户银行" placeholder="请选择" required @click="focus" v-validate="'required'" data-vv-name="开户银行" /> -->
<van-field v-model="userInfo.bankAddress" label="开户地" name="开户地" placeholder="请输入" v-validate="'required'" required clearable />
<van-field v-model="userInfo.accountName" label="开户姓名" name="开户姓名" placeholder="请输入" v-validate="'required'" required clearable />
<van-field
v-model="userInfo.bankCode"
maxlength="19"
label="银行卡号"
name="银行卡号"
placeholder="请输入"
required
clearable
v-validate="'required|bankCard'"
>
<van-button slot="button" size="small" type="danger" round @click="cardScanning('0')">银行卡扫描</van-button>
</van-field>
<van-field
v-model="bankCode"
maxlength="19"
label="确认银行卡号"
name="银行卡号"
placeholder="请再次输入银行卡号"
required
clearable
v-validate="'required|bankCard'"
>
</van-field>
<van-field
v-model="userInfo.perationPeriod"
type="digit"
label="从业年限"
name="从业年限"
placeholder="请输入整数"
v-validate="'onlyInteger'"
clearable
/>
<!-- <van-field
v-model="userInfo.perationPeriod"
type="digit"
label="从业年限"
name="从业年限"
placeholder="请输入整数"
v-validate="'required|onlyInteger'"
required
clearable
/> -->
<van-field v-model="userInfo.oldCompany" label="原工作单位" name="原工作单位" placeholder="请输入" required v-validate="'required'" clearable />
<van-field
:value="userInfo.oldOccupation | idToText('oldOccupation')"
label="原职业"
name="原职业"
v-validate="'required'"
readonly
required
right-icon="arrow"
placeholder="请选择"
@click="toSelect('11')"
/>
<van-field
:value="userInfo.sameTrade | idToText('rshealthCondition')"
label="是否同业"
name="是否同业"
v-validate="'required'"
readonly
required
right-icon="arrow"
placeholder="请选择"
@click="toSelect('3')"
/>
<van-field
:value="userInfo.nationality | idToText('rsnativeplace')"
label="国籍/地区"
name="国籍/地区"
v-validate="'required'"
readonly
required
right-icon="arrow"
placeholder="请选择"
@click="toSelect('12')"
/>
<van-field
:value="userInfo.foreigners | idToText('rshealthCondition')"
label="是否境外人员"
name="是否境外人员"
v-validate="'required'"
readonly
required
right-icon="arrow"
placeholder="请选择"
@click="toSelect('15')"
/>
<van-field
:value="userInfo.applGrade | idToText('applGrade')"
right-icon="arrow"
placeholder="请选择"
@click="toSelect('13')"
label="拟聘职级"
name="拟聘职级"
readonly
required
v-validate="'required'"
/>
</van-cell-group>
<van-cell-group class="" :border="false">
<p style=" border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 mt10 pv12">推荐人信息</p>
<van-field class="referrerW" v-model="ebiz_referrer.referCode" label="推荐人工号" name="推荐人工号" readonly />
<van-field class="referrerW" v-model="ebiz_referrer.referName" label="推荐人姓名" name="推荐人姓名" readonly />
<van-field class="referrerW" v-model="ebiz_referrer.teamManger" label="营业组主管工号" name="营业组主管工号" readonly />
<van-field class="referrerW" v-model="ebiz_referrer.teamMangerName" label="营业组主管姓名" name="营业组主管姓名" readonly />
<van-field class="referrerW" v-model="ebiz_referrer.officeManger" label="营业部经理工号" name="营业部经理工号" readonly />
<van-field class="referrerW" v-model="ebiz_referrer.officeMangerName" label="营业部经理姓名" name="营业部经理姓名" readonly />
<van-field class="referrerW" v-model="ebiz_referrer.areaManger" label=" 总监工号" name=" 总监工号" readonly />
<van-field class="referrerW" v-model="ebiz_referrer.areaMangerName" label="总监姓名" name="总监姓名" readonly />
</van-cell-group>
<van-button type="danger" class="bottom-btn" @click="nextStep" v-no-more-click="1000">下一步</van-button>
<!-- 字段选择 -->
<van-popup v-model="popupShow" position="bottom">
<van-picker show-toolbar :columns="columns" @confirm="onConfirm" @cancel="popupShow = false" />
</van-popup>
<!-- 地区选择 -->
<van-popup v-model="areaShow" position="bottom">
<van-area :area-list="areaList" value="110101" @confirm="sureArea($event, '1')" @cancel="areaShow = false" />
</van-popup>
<!-- 家庭地址选择 -->
<van-popup v-model="homeShow" position="bottom">
<van-area :area-list="areaList" value="110101" @confirm="sureArea($event, '2')" @cancel="homeShow = false" />
</van-popup>
<!-- 户籍选择 -->
<van-popup v-model="censusShow" position="bottom">
<van-area :area-list="areaList" value="110101" :columns-num="2" @confirm="sureArea($event, '3')" @cancel="censusShow = false" />
</van-popup>
<!--身份证扫描 -->
<van-popup v-model="isScan" position="bottom">
<IdentityCardScan @getScanInfo="getIdentityInfo"></IdentityCardScan>
</van-popup>
<!--身份证扫描 -->
<van-popup v-model="isScan" style="height:100vh" position="bottom">
<BankCardScan :scanShow="isScan" @getScanInfo="getBankCardInfo" :clear="isClear"></BankCardScan>
</van-popup>
<!-- 二次输入银行卡号校验弹出 -->
<van-dialog id="card" v-model="checkShow" show-cancel-button @confirm="bankCodeConfirm(bankCode)">
<p class="p10 fs16 text-center green mt5">请再次输入银行卡号</p>
<van-cell-group class="flex align-items-c pr5 mb15">
<van-field label="银行卡号:" name="银行卡号" maxlength="19" v-model="bankCode" clearable placeholder="请输入银行卡号" required />
</van-cell-group>
<p class="fs14 mt5 ml5">是否确认提交一旦提交在人管审批之前无法再次进行修改</p>
</van-dialog>
<!--开户银行选择-->
<SelectBankName :inputShow="inputShow" :listShow.sync="islistShow" :operateType="'enter_bank_type'" @getBank="getBank"></SelectBankName>
</div>
</template>
<script>
import { Field, CellGroup, Checkbox, Popup, Picker, Area, RadioGroup, Radio, List, Cell } from 'vant'
import SelectRadio from '@/components/ebiz/SelectRadio'
import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
import OccupationPicker from '@/components/ebiz/occipation/OccupationPicker'
import CustomerPicker from '@/components/ebiz/customer/CustomerPicker'
import BankCardScan from '@/components/ebiz/sale/BankCardScan'
import areaList from '@/assets/js/utils/area'
import idNoCheck from '@/assets/js/utils/idNoCheck'
// import DataDictionary from '@/assets/js/utils/data-dictionary'
import IdentityCardScan from '@/components/ebiz/sale/IdentityCardScan'
import beforeDate from '@/assets/js/utils/getBeforeDate.js'
import RsTop from '@/components/ebiz/agentEenter/RsTop'
import { saveOrUpdateInfo, agentAll } from '@/api/ebiz/agentEenter/agentEenter.js'
import { idToData } from '@/views/ebiz/customer/js/verification'
import SelectBankName from '@/components/ebiz/account/SelectBankName'
import getBankName from '@/components/ebiz/account/getBankName'
import getBankCode from '@/components/ebiz/account/getBankCode'
import { getBankList } from '@/api/ebiz/sale/sale'
import MinXin from '@/components/ebiz/account/mixins'
import {
selectComp,
// appCallBack,
chooseOccupation,
toSelect,
onConfirm,
onDateConfirm,
chooseCustomer,
sureArea,
getIdentityInfo,
getCode,
effectiveDataTypeChange
} from './js/methods'
export default {
name: 'insuredInfo',
mixins: MinXin,
components: {
SelectBankName, //开户银行弹窗
[SelectRadio.name]: SelectRadio,
[FieldDatePicter.name]: FieldDatePicter,
[OccupationPicker.name]: OccupationPicker,
[CustomerPicker.name]: CustomerPicker,
[Field.name]: Field,
[CellGroup.name]: CellGroup,
[Checkbox.name]: Checkbox,
[Popup.name]: Popup,
[Picker.name]: Picker,
[Area.name]: Area,
[RadioGroup.name]: RadioGroup,
[Radio.name]: Radio,
[IdentityCardScan.name]: IdentityCardScan,
[RsTop.name]: RsTop,
BankCardScan,
[List.name]: List,
[Cell.name]: Cell
},
data() {
return {
inputShow: false, //模糊查询功能
islistShow: false, //选择银行弹窗
bankList: [], //银行名称列表
code: '',
bankName: '', //银行名称
bankCode: '', //二次输入的银行卡号
checkShow: false, //银行卡校验弹框是否显示 false-不显示 true-显示
isScan: false, //是否显示证件扫描组件
//是否清空
isClear: false,
sexRadio: [
{
label: '男',
value: '0'
},
{
label: '女',
value: '1'
}
],
medicalRadio: [
{
label: '有',
value: '0'
},
{
label: '无',
value: '1'
}
],
maxDate: beforeDate.getBeforeYear(16),
codeDisabled: false, //获取验证码按钮是否禁用
countDown: 60, //倒计时
certiexpiredateRequired: true, //证件截止日期是否需要校验
popupShow: false,
areaShow: false, //省级联动
homeShow: false,
censusShow: false, //户籍联动
pickerType: undefined,
columns: [],
valueKey: 'text',
census: '', //户籍
// areaName: '', //单位地址
// homeName: '', //家庭地址
companyDefault: false, //设置公司地址为默认地址
homeDefault: false, //设置家庭地址为默认地址
setDefaultAddress: false, //设为联系地址
sessionId: '', //后台返回的 id
effectiveDateTypeAble: false, //长期按钮是否禁用
userInfo: {
name: '', //姓名
sex: '0', //性别
age: '', // 年龄
birthday: '', // 手机
mobile: '', //移动电话
nativePlace: '', //籍贯
ethnic: '', //民族
// homeProvince: '', //家庭省
health: '', //健康状况
marriage: '', //婚姻状况
political: '', //政治面貌
degree: '', //学历
school: '', // 学校
discipline: '', // 专业
// homePhone: '', //家庭电话
idType: '1', //证件类型
idNo: '', //证件号码
dateStart: '', //证件起始日期
dateEnd: '', //证件到期时间
email: '', //电子邮箱
zip: '', //邮编
address: '', //现住址
bankProvince: '', // 开户省
bankCity: '', // 开户市
bankName: '', // 开户银行
// 银行卡号
bankCode: '',
rgtAddress: '', //户口所在地
title: '', //职称
accountName: '', //开户姓名
perationPeriod: '', //从业年限
oldCompany: '', //原工作单位
oldOccupation: '', //原职业
sameTrade: '', //是否同业
nationality: 'CHN', //国籍/地区
foreigners: '', //是否境外人员
applGrade: '', //职级
isRevoke: 0
},
areaList: areaList,
currentPopupIndex: '',
customerShowPicker: false,
occupationShowPicker: false,
timeId: null,
ebiz_referrer: {
referCode: '--',
referName: '--',
teamCode: '--',
teamName: '--',
officeCode: '--',
officeName: '--',
areaCode: '--',
areaName: '--'
}
}
},
created() {
this.getBankList()
},
mounted() {
// 筛选按钮的点击事件
// window.appCallBack = this.appCallBack
window.appCallBack = this.appCallBack
this.agentAll()
},
methods: {
// 获取银行卡列表
getBankList() {
let data = {
operateType: 'enter_bank_type'
}
getBankList(data).then(res => {
if (res.result == '0') {
this.bankList = res.content
this.bankList1 = res.content
} else {
this.$toast(res.resultMessage)
}
})
},
getBank(bank) {
//获取银行名称
this.bankName = bank.bankName
this.code = bank.code
},
//获取推荐人信息
agentAll() {
let data = {
// userModel: { mobile: 13000000000 } //线上去掉
}
let that = this
that.$toast.loading({
duration: 0, // 持续展示 toast
forbidClick: true, // 禁用背景点击
loadingType: 'spinner',
message: '加载中……'
})
agentAll(data).then(res => {
if (res.result == '0') {
that.$toast.clear()
this.userInfo = res.content.ebizEnterCustomerDto
this.ebiz_referrer = res.content.ebizReferrerDto
if (this.userInfo.idType == '1') {
this.effectiveDateTypeAble = idToData(this.userInfo.idNo).age < 45
this.userInfo.birthday = idToData(this.userInfo.idNo).birthday
this.userInfo.age = idToData(this.userInfo.idNo).age
this.userInfo.sex = idToData(this.userInfo.idNo).sex
}
if (this.userInfo.bankName) {
this.bankName = getBankName(this.bankList, this.userInfo.bankName)
}
this.userInfo.nationality = 'CHN'
}
})
},
//监听名字变化
nameChange(name) {
this.userInfo.name = name
},
selectClick(index) {
selectComp(this, index, '1')
},
chooseOccupation() {
chooseOccupation(this, '1')
},
//弹框选择
toSelect(pickerType, valueKey) {
console.log(pickerType)
toSelect(this, pickerType, valueKey, '1')
},
//确认选择字段
onConfirm(value) {
onConfirm(this, value, '1')
},
//证件起始截止日期
onDateConfirm(val, type) {
onDateConfirm(this, val, type)
},
//选择客户
chooseCustomer(data) {
chooseCustomer(this, data, '1')
},
// 点击下一步
nextStep() {
if (this.userInfo.bankCode.trim() && this.bankCode.trim() && this.userInfo.bankCode !== this.bankCode) {
return this.$toast('两次输入的银行卡号不一致!')
}
this.$validator.validate().then(valid => {
if (valid == true) {
if (this.userInfo.idType == '1') {
//身份证
if (!idNoCheck.isIdno(this.userInfo.idNo)) {
return this.$toast('请录入正确的身份证')
}
if (this.userInfo.idNo.length == '18') {
//18位身份证第17位是性别位, 奇男偶女
let sexSign = this.userInfo.idNo.substr(16, 1)
if ((parseInt(sexSign) % 2 == 0 && this.userInfo.sex != 1) || (parseInt(sexSign) % 2 != 0 && this.userInfo.sex != 0)) {
return this.$toast('性别录入与身份证不符')
}
//18位身份证第7-14位是生日位, 年月日
let birthSign = this.userInfo.idNo.substr(6, 8)
if (
this.userInfo.birthday.substr(0, 4) != birthSign.substr(0, 4) ||
this.userInfo.birthday.substr(5, 2) != birthSign.substr(4, 2) ||
this.userInfo.birthday.substr(8, 2) != birthSign.substr(6, 2)
) {
return this.$toast('生日录入与身份证不符')
}
}
}
if (this.userInfo.name != this.userInfo.accountName) {
return this.$toast('姓名与开户名要一致')
}
// if (this.userInfo.bankName == '工商银行') {
// this.userInfo.bankName = '102'
// }
this.userInfo.bankName = getBankCode(this.bankList, this.bankName)
if (
//学历为初中、小学、其他、文盲阻断入司
Number(this.userInfo.degree) == 13 ||
Number(this.userInfo.degree) == 12 ||
Number(this.userInfo.degree) == 8 ||
Number(this.userInfo.degree) == 6
) {
return this.$toast('您的学历不符合入司要求,不允许入司。')
}
this.bankCodeConfirm()
} else {
this.$toast(this.errors.all()[0])
}
})
},
save() {
let data = {
entryType: 'CUSTOMER_BASE',
// userModel: { mobile: 13000000000 }, //线上去掉
ebizEnterCustomerDto: this.userInfo
}
saveOrUpdateInfo(data).then(res => {
if (res.result == '0') {
this.$toast.clear()
localStorage.agentSex = this.userInfo.sex
this.$jump({
flag: 'h5',
extra: {
url: location.origin + `/#/agentEenter/AgentEnterGuarantor`
},
routerInfo: {
path: `/agentEenter/AgentEnterGuarantor`
}
})
} else {
this.$toast(res.resultMessage)
}
})
},
//区域选择
sureArea(area, type) {
sureArea(this, area, type)
},
//设为联系地址
setAddress() {
//上面是0下面是1
if (this.homeDefault) {
this.userInfo.addressStatus = 1
}
if (this.companyDefault) {
this.userInfo.addressStatus = 0
}
},
//获取验证码
getCode() {
getCode(this, '1')
},
//证件扫描
// goScan() {
// this.isScan = true
// },
//长期状态改变时
effectiveDataTypeChange(val) {
if (val) {
this.userInfo.dateEnd = '9999-01-01'
} else {
this.userInfo.dateEnd = ''
}
effectiveDataTypeChange(this, val)
},
//获取身份证扫描信息
getIdentityInfo(data) {
getIdentityInfo(this, data, '1')
},
// 银行卡扫描
cardScanning(cardScanningType) {
window.localStorage.setItem('cardScanningType', cardScanningType)
document.body.style.backgroundColor = '#F5F5F5'
let title = ''
this.isclear = false
;[this.isScan, title] = [true, '银行卡扫描']
setTimeout(() => {
this.$jump({
flag: 'navigation',
extra: {
title,
hiddenLeft: '1'
}
})
this.closeBtn()
}, 400)
},
closeBtn() {
// 筛选按钮的显示
this.$jump({
flag: 'webview_right_button',
extra: {
btns: [
{
img: this.$assetsUrl + 'images/del-close.png',
route: { flag: '', extra: {} }
}
]
}
})
},
appCallBack() {
// 筛选按钮的点击事件
this.$jump({
flag: 'navigation',
extra: {
title: '入司基本信息',
hiddenRight: '1'
}
})
this.isScan = false
},
//获取银行卡扫描信息
getBankCardInfo(data) {
this.userInfo.bankCode = data.name
this.$jump({
flag: 'navigation',
extra: {
title: '入司基本信息',
hiddenRight: '1'
}
})
this.isScan = false
},
bankCodeConfirm() {
this.save()
}
},
beforeDestroy() {
//清理计时器
window.clearInterval(this.timeId)
this.timeId = null
this.countDown = 60
this.codeDisabled = false
}
}
</script>
<style lang="scss" scoped>
.insured-info-container {
/deep/.van-checkbox {
margin-left: auto;
}
/deep/.van-radio {
margin-left: auto;
}
.referrerW {
/deep/.van-cell__title {
width: 120px;
}
}
#card {
/deep/.van-cell__value {
border-bottom: 2px solid #e9332e;
}
}
}
/deep/ .van-field__label {
display: flex;
align-items: center;
}
</style>