mirror of
http://112.124.100.131/GFRS/ebiz-h5.git
synced 2025-12-08 09:26:44 +08:00
1012 lines
38 KiB
Vue
1012 lines
38 KiB
Vue
<template>
|
||
<div class='insured-info-container pb50'>
|
||
<!-- 投保人信息 -->
|
||
<van-cell-group class='mt10'>
|
||
<p style='border-bottom: 1px solid #ebedf0' class='fs15 fwb pl10 pv12'>投保人信息</p>
|
||
<customer-picker
|
||
@on-choose='chooseCustomer(arguments)'
|
||
v-validate="'required|name'"
|
||
name='投保人姓名'
|
||
label='投保人姓名'
|
||
required
|
||
:parentShowPicker.sync='customerShowPicker'
|
||
v-model='userInfo.name'
|
||
@nameChange='nameChange'
|
||
@on-click="selectClick('1', '0')"
|
||
></customer-picker>
|
||
<van-field
|
||
:value="userInfo.idType | idToText('insuredIdType')"
|
||
v-validate="'required'"
|
||
readonly
|
||
required
|
||
label='证件类型'
|
||
@click="toSelect('2')"
|
||
name='证件类型'
|
||
right-icon='arrow'
|
||
placeholder='请选择'
|
||
/>
|
||
|
||
<!-- <van-field v-model="userInfo.idNo" v-validate="'required|idNo'" maxlength="18" label="证件号码" name="证件号码" placeholder="请输入" clearable> -->
|
||
<van-field
|
||
v-model='userInfo.idNo'
|
||
maxlength='18'
|
||
required
|
||
label='证件号码'
|
||
v-validate="'required'"
|
||
name='证件号码'
|
||
placeholder='请输入'
|
||
clearable
|
||
@blur="getRelatedData(userInfo.idNo, '1')"
|
||
>
|
||
<van-button v-if='userInfo.idType == 1' slot='button' size='small' type='danger' round
|
||
@click="selectClick('3', '', '1')">证件扫描
|
||
</van-button>
|
||
</van-field>
|
||
<FieldDatePicter
|
||
:v-validate='{ required: certiexpiredateRequired }'
|
||
required
|
||
label='证件截止日期'
|
||
name='证件截止日期'
|
||
:minDate='certiexpiredateMin'
|
||
:value.sync='userInfo.certiexpiredate'
|
||
type='date'
|
||
@confirm="onDateConfirm($event, '1')"
|
||
ref='certiexpiredate'
|
||
:flag='true'
|
||
:readonly='idLimit'
|
||
></FieldDatePicter>
|
||
<div class='border-bt relative fs14 p10 flex justify-content-fe'>
|
||
<van-checkbox v-model='userInfo.effectiveDateType' :disabled='effectiveDateTypeAble'
|
||
@change='effectiveDataTypeChange'>长期
|
||
</van-checkbox>
|
||
</div>
|
||
<select-radio required :radios='sexRadio' label='性别' name='性别' v-validate="'required'"
|
||
:value.sync='userInfo.sex'></select-radio>
|
||
<FieldDatePicter
|
||
v-validate="'required'"
|
||
label='出生日期'
|
||
name='出生日期'
|
||
required
|
||
:value.sync='userInfo.birthday'
|
||
type='date'
|
||
:flag='true'
|
||
@confirm="onDateConfirm($event, '2')"
|
||
ref='birthday'
|
||
:maxDate='maxDate'
|
||
>
|
||
</FieldDatePicter>
|
||
<van-field
|
||
required
|
||
v-model='userInfo.mobile'
|
||
clearable
|
||
label='手机号码'
|
||
name='手机号码'
|
||
placeholder='请输入'
|
||
v-validate="'required|mobile'"
|
||
maxlength='11'
|
||
/>
|
||
<van-field required v-model='userInfo.email' label='电子邮箱' name='电子邮箱' placeholder='如需电子保单，请填写' v-validate="'required|email'"
|
||
clearable />
|
||
<!-- <van-field v-model="userInfo.workcompany" required label="工作单位" name="工作单位" placeholder="请输入" v-validate="'required'" maxlength="50" clearable /> -->
|
||
<van-field
|
||
v-validate="'required'"
|
||
@click="openOccupation('1')"
|
||
required
|
||
label='职业类别'
|
||
placeholder='请输入'
|
||
name='职业类别'
|
||
:value='userInfo.occupationName'
|
||
right-icon='arrow'
|
||
/>
|
||
<van-field
|
||
v-if='averageAnnualIncomeFlag'
|
||
v-model='userInfo.averageAnnualIncome'
|
||
label='平均年收入（万元）'
|
||
name='平均年收入'
|
||
required
|
||
placeholder='请输入，单位万元'
|
||
v-validate="'required|onlyNumber'"
|
||
clearable
|
||
maxlength='5'
|
||
/>
|
||
<van-field
|
||
v-validate="'required'"
|
||
:value="userInfo.nativeplace | idToText('nativeplace')"
|
||
readonly
|
||
required
|
||
label='国籍'
|
||
name='国籍'
|
||
right-icon='arrow'
|
||
placeholder='请选择'
|
||
@click="toSelect('1')"
|
||
/>
|
||
<van-field
|
||
:value="userInfo.marriage | idToText('marriage')"
|
||
readonly
|
||
required
|
||
label='婚姻状况'
|
||
name='婚姻状况'
|
||
v-validate="'required'"
|
||
right-icon='arrow'
|
||
placeholder='请选择'
|
||
@click="toSelect('6')"
|
||
/>
|
||
<div class="p15 pl8 fs14" style="border-bottom: 1px solid #eee;display: flex;justify-content: space-between;align-items: center;" v-if="manageComCode == '45'">
|
||
<van-radio-group v-model="userInfo.isNewPeopleFlag" class="flex">
|
||
<label>
|
||
<i class="red">*</i>
|
||
新市民身份
|
||
</label>
|
||
<van-radio name="1" class="ml30">是</van-radio>
|
||
<van-radio name="0" class="ml20">否</van-radio>
|
||
</van-radio-group>
|
||
<van-icon name="question-o" size="20" @click="isNewPeopleFlagTip = true"/>
|
||
</div>
|
||
<van-field
|
||
v-if="userInfo.isNewPeopleFlag == 1"
|
||
:value="userInfo.npType | idToText('npType')"
|
||
readonly
|
||
label="新市民类型"
|
||
name="新市民类型"
|
||
required
|
||
right-icon="arrow"
|
||
placeholder="请选择"
|
||
v-validate="'required'"
|
||
@click="toSelect('11')"
|
||
/>
|
||
<van-field
|
||
v-model='userInfo.homeName'
|
||
readonly
|
||
label='联系地址'
|
||
name='联系地址'
|
||
required
|
||
right-icon='arrow'
|
||
placeholder='请选择'
|
||
v-validate="'required'"
|
||
@click="areaSelect('1')"
|
||
/>
|
||
<van-field v-model='userInfo.homeAddress' label name='详细地址' placeholder='请输入详细地址' v-validate="'required'"
|
||
clearable maxlength='30' />
|
||
<!-- </template> -->
|
||
</van-cell-group>
|
||
<van-goods-action style='z-index: 99'>
|
||
<!-- <van-button type='default' style='width: 50%; font-size: 14px; height: 40px; background: white'
|
||
>总保费:<span style='color: red; font-weight: bold; font-size: 18px; font-weight: 400'>{{ allPrice }}</span
|
||
>元
|
||
</van-button
|
||
> -->
|
||
<van-goods-action-button type='danger' text='下一步' @click='nextStep' v-no-more-click='1000'
|
||
style='border-radius: 0em; width: 50%; height: 40px' />
|
||
</van-goods-action>
|
||
<!-- <van-dialog v-model="showDialog" title="温馨提示" message="被保险人年龄与所投保的方案不一致，请核实。" show-cancel-button @confirm="nextStep" confirmButtonText="继续投保" cancelButtonText="核对信息"> -->
|
||
|
||
<!-- </van-dialog> -->
|
||
<!-- 职业类别弹窗 -->
|
||
<van-popup v-model='occupationShowPicker' position='bottom'>
|
||
<occupation-for-loop @chooseOccupation='chooseOccupation' :name='occupationName' :code='occupationCode'
|
||
:type='occupationalType'></occupation-for-loop>
|
||
</van-popup>
|
||
<!-- 字段选择 -->
|
||
<van-popup v-model='popupShow' position='bottom'>
|
||
<van-picker show-toolbar :columns='columns' @confirm='onConfirm' :default-index='pickerIndex'
|
||
@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='areaCode' @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='isScan2' position='bottom'>
|
||
<IdentityCardScan @getScanInfo='getIdentityInfo'></IdentityCardScan>
|
||
</van-popup>
|
||
<van-dialog v-model="isNewPeopleFlagTipshow" :showConfirmButton="false">
|
||
<div slot="title">
|
||
<p style="color: #E9332E;">新市民身份说明</p>
|
||
</div>
|
||
<div style="padding: 20px 30px 30px;font-size: 14px;">
|
||
<div style="line-height: 25px;">新市民是指因本人创业就业、子女上学、投靠子女等原因来到城镇常住，未获得当地户籍或获得当地户籍不满三年的各类群体，包括但不限于进城务工人员、新就业大中专毕业生等。</div>
|
||
</div>
|
||
<div style="text-align: center;margin-bottom: 30px;">
|
||
<van-button round type="danger" size="small" style="padding:0px 35px;font-size: 14px;" @click="isNewPeopleFlagTipshow = false">我知道了</van-button>
|
||
</div>
|
||
</van-dialog>
|
||
</div>
|
||
</template>
|
||
<script>
|
||
import { Field, CellGroup, Checkbox, CheckboxGroup, Popup, Picker, Area, RadioGroup, Radio } 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 DataDictionary from '@/assets/js/utils/data-dictionary'
|
||
import areaList from '@/assets/js/utils/areaForSale'
|
||
import { saveOrUpdateGroupCard,cardOrderDetail } from '@/api/ebiz/cardList/cardList.js'
|
||
import utilsAge from '@/assets/js/utils/age'
|
||
import getAreaName from '@/assets/js/utils/getAreaNameForSale'
|
||
import IdentityCardScan from '@/components/ebiz/sale/IdentityCardScan'
|
||
import idNoCheck from '@/assets/js/utils/idNoCheck'
|
||
import beforeDate from '@/assets/js/utils/getBeforeDate.js'
|
||
import afterDate from '@/assets/js/utils/getAfterDate.js'
|
||
import CacheUtils from '@/assets/js/utils/cacheUtils'
|
||
import { idToData } from './js/verification'
|
||
import OccupationForLoop from '@/components/ebiz/occipation/OccupationForLoop'
|
||
import { selectComp, getIdentityInfo } from './js/methods'
|
||
import Vue from 'vue'
|
||
import { GoodsAction, GoodsActionIcon, GoodsActionButton } from 'vant'
|
||
import riskRules from '@/views/ebiz/common/risk-rules'
|
||
|
||
DataDictionary.relationToAppnt = DataDictionary.relationToAppnt.slice(0, 4)
|
||
Vue.use(Checkbox).use(CheckboxGroup)
|
||
Vue.use(GoodsAction)
|
||
.use(GoodsActionIcon)
|
||
.use(GoodsActionButton)
|
||
export default {
|
||
name: 'GroupAppntInfo',
|
||
components: {
|
||
[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,
|
||
OccupationForLoop
|
||
},
|
||
data() {
|
||
return {
|
||
cardOrderNo:'',
|
||
averageAnnualIncomeFlag: false, // 20210730 年收入不展示且默认为0 核心对年收入有非空校验
|
||
idLimit: false, //截止日期是否可编辑
|
||
certiexpiredateRequired: true, //证件截止日期是否需要校验
|
||
effectiveDateTypeAble: false, //长期按钮是否禁用
|
||
proScheme: '', //保障方案
|
||
proSchemeCode: '',
|
||
productDate: '', //保险期间
|
||
now: afterDate.getAfterDays(1), //指定生效日期最小值
|
||
certiexpiredateMin: afterDate.getAfterDays(1), //证件截止日期最小值
|
||
isScan: false, //是否显示证件扫描组件
|
||
isScan2: false, //是否显示证件扫描组件--被保人
|
||
allPrice: 0,
|
||
result: [],
|
||
checked: true,
|
||
current: 'userInfo',
|
||
sexRadio: [
|
||
{
|
||
label: '男',
|
||
value: '0'
|
||
},
|
||
{
|
||
label: '女',
|
||
value: '1'
|
||
}
|
||
],
|
||
medicalRadio: [
|
||
{
|
||
label: '有',
|
||
value: '0'
|
||
},
|
||
{
|
||
label: '无',
|
||
value: '1'
|
||
}
|
||
],
|
||
maxDate: beforeDate.getBeforeYear(18), //投保人出生日期可选最大值
|
||
filterMaxDate: beforeDate.getBeforeYear(-2),
|
||
popupShow: false,
|
||
areaShow: false, //省级联动
|
||
homeShow: false, //家庭地址联动
|
||
censusShow: false, //户籍联动
|
||
pickerType: undefined,
|
||
columns: [],
|
||
valueKey: 'text',
|
||
homeName: '', //家庭地址
|
||
bnfTypeVal: '法定受益人', //受益人类型文字展示
|
||
cvaliDate: '', //指定生效日期
|
||
//投保人信息
|
||
userInfo: {
|
||
name: '', //投保人姓名
|
||
// insuredname: '',
|
||
sex: '0', //投保人性别
|
||
// bnfType: '0', // 受益人类型
|
||
// bnfSelec: '请选择',
|
||
birthday: '', //投保人出生日期
|
||
idType: '1', //证件类型
|
||
idNo: '', //证件号码
|
||
certiexpiredate: '', //证件到期时间
|
||
effectiveDateType: false, //是否长期
|
||
occupationCode: '', //职业代码
|
||
occupationName: '', //职业名称
|
||
averageAnnualIncome: '', //平均年收入
|
||
lifeGrade: '', //寿险等级
|
||
healthGrade: '', //健康等级
|
||
nativeplace: '1', //国家地区
|
||
marriageStatus: '', //婚姻状况
|
||
homeProvince: '450000', //家庭省
|
||
homeCity: '450100', //家庭市
|
||
homeArea: '450101', //家庭区
|
||
homeName: '', //联系地址
|
||
homeAddress: '', //详细地址
|
||
mobile: '', //移动电话
|
||
email: '', //电子邮箱
|
||
schoolName: '',
|
||
className: '',
|
||
isNewPeopleFlag: '', //新市民身份
|
||
npType: '', //新市民类型
|
||
// effectiveDate: '' //指定生效日期
|
||
},
|
||
selectUser: '',
|
||
areaList: areaList,
|
||
currentPopupIndex: '',
|
||
customerShowPicker: false,
|
||
customerShowPicker2: false,
|
||
occupationShowPicker: false,
|
||
timeId: null,
|
||
pdf: ['', '', ''],
|
||
insureType: '',
|
||
pickerIndex: 0,
|
||
areaCode: '450101',
|
||
occupationCode: '',
|
||
occupationName: '',
|
||
// showDialog:false,
|
||
showField: false,
|
||
medical: '0',
|
||
firstOr: '0',
|
||
chooseKind: '',
|
||
withRootUser: {
|
||
load: false, //防止重复请求
|
||
value: false
|
||
},
|
||
occupationalType: DataDictionary.queryOccupationalByType[0].id,
|
||
manageComCode: '',
|
||
isNewPeopleFlagTipshow: false,
|
||
}
|
||
},
|
||
created() {
|
||
this.userInfo.homeName = getAreaName([{ code: 450000 }, { code: 450100 }, { code: 450101 }]) //家庭地址
|
||
},
|
||
async mounted() {
|
||
let that = this
|
||
setTimeout(() => {
|
||
// eslint-disable-next-line no-undef
|
||
EWebBridge.webCallAppInJs('webview_left_button', {
|
||
img: this.$assetsUrl + 'images/del-close-btn@3x.png',
|
||
intercept: '1', //是否拦截原生返回事件 1是 其他否
|
||
})
|
||
}, 100)
|
||
// 筛选按钮的点击事件
|
||
window.appCallBack = this.appCallBack
|
||
let dataReturn = await riskRules.getAgentInfoFunc(this)
|
||
this.manageComCode = dataReturn.manageComCode
|
||
if (this.$route.query.cardOrderNo) {
|
||
this.cardOrderNo = this.$route.query.cardOrderNo
|
||
//根据后台数据来展示
|
||
let cardInfoDTO = {
|
||
orderNo: this.cardOrderNo
|
||
}
|
||
cardOrderDetail(cardInfoDTO).then(res => {
|
||
if (res.result == '0') {
|
||
Object.assign(that.userInfo,res.orderDTO.appntDTO)
|
||
that.userInfo.effectiveDateType = that.userInfo.effectiveDateType == 'true'?true:false
|
||
that.userInfo.certiexpiredate = that.userInfo.effectiveDateType == 'true'?'':that.userInfo.certiexpiredate
|
||
that.userInfo.homeName = getAreaName([
|
||
{ code: that.userInfo.homeProvince },
|
||
{ code: that.userInfo.homeCity },
|
||
{ code: that.userInfo.homeArea }
|
||
])
|
||
if (this.userInfo.birthday) {
|
||
let age = utilsAge.getAge(this.userInfo.birthday, new Date())
|
||
this.effectiveDateTypeAble = !(age >= 45)
|
||
}
|
||
}
|
||
})
|
||
}
|
||
},
|
||
methods: {
|
||
//长期状态改变时
|
||
effectiveDataTypeChange(val) {
|
||
//勾选长期状态时,证件截止日期置空
|
||
if (val) {
|
||
this.userInfo.certiexpiredate = ''
|
||
this.certiexpiredateRequired = false
|
||
} else {
|
||
this.certiexpiredateRequired = true
|
||
}
|
||
},
|
||
/**
|
||
* @description:
|
||
* @param {*} data
|
||
* @return {*}
|
||
*/
|
||
chooseOccupation(data) {
|
||
let { code, name, healthGrade, lifeGrade } = data
|
||
this.$jump({
|
||
flag: 'navigation',
|
||
extra: {
|
||
title: '填写投保人信息',
|
||
hiddenRight: '1'
|
||
}
|
||
})
|
||
this.occupationShowPicker = false
|
||
if (this.insureType === '1') {
|
||
this.userInfo.occupationName = name
|
||
this.userInfo.occupationCode = code
|
||
this.userInfo.occupationType = lifeGrade
|
||
}
|
||
},
|
||
/**
|
||
* @description:
|
||
* @param {*}
|
||
* @return {*}
|
||
*/
|
||
openOccupation(insureType) {
|
||
selectComp(this, 2, '1')
|
||
this.insureType = insureType
|
||
if (this.insureType === '1') {
|
||
// this.occupationName = this.userInfo.occupationName
|
||
// this.occupationCode = this.userInfo.occupationCode
|
||
}
|
||
},
|
||
appCallBack(data) {
|
||
if (data.trigger == 'left_button_click') {
|
||
return this.$dialog
|
||
.confirm({
|
||
className: 'dialog-delete',
|
||
title: '提示',
|
||
message: '退出流程可能会丢失部分数据，是否确认退出？',
|
||
cancelButtonColor: '#E9332E',
|
||
confirmButtonColor: '#FFFFFF',
|
||
})
|
||
.then(() => {
|
||
this.$jump({
|
||
flag: 'h5',
|
||
extra: {
|
||
title: '产品列表',
|
||
forbidSwipeBack: 1, //当前页面禁止右滑返回
|
||
url: location.origin + `/#/cardList/cardTotreasure`,
|
||
},
|
||
routerInfo: {
|
||
path: `/cardList/cardTotreasure`,
|
||
type: '1',
|
||
},
|
||
})
|
||
})
|
||
.catch(() => {
|
||
return
|
||
})
|
||
} else {
|
||
if (this.currentPopupIndex == 1) {
|
||
if (this.selectUser == '1') {
|
||
this.customerShowPicker2 = false
|
||
} else {
|
||
this.customerShowPicker = false
|
||
}
|
||
} else if (this.currentPopupIndex == 2) {
|
||
this.occupationShowPicker = false
|
||
} else if (this.currentPopupIndex == 3) {
|
||
this.isScan = false
|
||
this.isScan2 = false
|
||
}
|
||
// 筛选按钮的点击事件
|
||
this.$jump({
|
||
flag: 'navigation',
|
||
extra: {
|
||
title: '填写投保人信息',
|
||
hiddenRight: '1',
|
||
},
|
||
})
|
||
}
|
||
},
|
||
areaSelect(insureType) {
|
||
;[this.homeShow, this.insureType] = [true, insureType]
|
||
if (insureType === '1') {
|
||
this.areaCode = this.userInfo.homeArea
|
||
}
|
||
},
|
||
//监听名字变化
|
||
nameChange(name) {
|
||
// console.log('name',name)
|
||
this.userInfo.name = name
|
||
},
|
||
/**
|
||
* @description:
|
||
* @param {*} index
|
||
* @param {*} value
|
||
* @param {*} insureType '1'为投保人 '2'为被投保人
|
||
* @return {*}
|
||
*/
|
||
selectClick(index, value, insureType) {
|
||
if (value !== undefined) {
|
||
this.selectUser = value
|
||
}
|
||
this.insureType = insureType
|
||
selectComp(this, index, insureType)
|
||
// console.log(index, value)
|
||
// localStorage.setItem('value', value)
|
||
},
|
||
//弹框选择
|
||
toSelect(pickerType, valueKey) {
|
||
//pickerType 1、国家地区 2、证件类型 3、文化程度 4、有无社保(弃用) 5、税收居民身份 6、婚姻状况 7、在职情况 8、收入来源, 9 关系
|
||
;[this.popupShow, this.pickerType] = [true, pickerType]
|
||
if (valueKey) this.valueKey = valueKey
|
||
if (pickerType == '1') {
|
||
this.columns = DataDictionary.nativeplace
|
||
this.pickerIndex = this.userInfo.nativeplace - 1 > 0 ? this.userInfo.nativeplace - 1 : 0
|
||
} else if (pickerType == '2') {
|
||
this.columns = DataDictionary.cardListInsuredIdType.slice(0, 1)
|
||
console.log(this.columns, '=======================this.columns==================')
|
||
} else if (pickerType == '3') {
|
||
this.columns = DataDictionary.degree
|
||
} else if (pickerType == '4') {
|
||
this.columns = [
|
||
{ id: 0, text: '有' },
|
||
{ id: 1, text: '无' }
|
||
]
|
||
} else if (pickerType == '5') {
|
||
this.columns = DataDictionary.taxIdentity
|
||
} else if (pickerType == '6') {
|
||
this.columns = DataDictionary.marriage
|
||
this.pickerIndex = this.userInfo.marriage - 1 > 0 ? this.userInfo.marriage - 1 : 0
|
||
} else if (pickerType == '7') {
|
||
this.columns = DataDictionary.workCondition
|
||
} else if (pickerType == '8') {
|
||
this.columns = DataDictionary.salarySource
|
||
} else if (pickerType == '11') {
|
||
this.columns = DataDictionary.npType
|
||
}
|
||
},
|
||
//确认选择字段
|
||
onConfirm(value) {
|
||
console.log(value, 'value')
|
||
this.popupShow = false
|
||
if (this.pickerType == '1') {
|
||
this.userInfo.nativeplace = value.id
|
||
} else if (this.pickerType == '2') {
|
||
//身份证以外的证件类型可以使用长期
|
||
//value.id 1 居民身份证 todo
|
||
if (value.id != '1') {
|
||
this.effectiveDateTypeAble = false
|
||
} else {
|
||
if (this.userInfo.birthday) {
|
||
let age = utilsAge.getAge(this.userInfo.birthday, new Date())
|
||
this.effectiveDateTypeAble = !(age >= 45)
|
||
}
|
||
}
|
||
this.userInfo.idType = value.id
|
||
} else if (this.pickerType == '3') {
|
||
this.userInfo.degree = value.id
|
||
} else if (this.pickerType == '4') {
|
||
this.userInfo.socialSecurity = value.id
|
||
} else if (this.pickerType == '5') {
|
||
this.userInfo.taxResidentId = value.id
|
||
} else if (this.pickerType == '6') {
|
||
this.userInfo.marriage = value.id
|
||
this.userInfo.marriageStatus = value.text
|
||
} else if (this.pickerType == '7') {
|
||
this.userInfo.jobStatus = value.id
|
||
} else if (this.pickerType == '8') {
|
||
this.userInfo.salarySource = value.id
|
||
} else if (this.pickerType == '10') {
|
||
this.proScheme = value.text
|
||
this.proSchemeCode = value.id
|
||
this.chooseKind = value.label
|
||
} else if (this.pickerType === '11') {
|
||
this.userInfo.npType = value.id
|
||
}
|
||
},
|
||
//证件起始截止日期
|
||
onDateConfirm(val, type) {
|
||
console.log(type)
|
||
switch (type) {
|
||
case '0': {
|
||
//证件起始日期
|
||
//如果录入日期早于出生日期或晚于当前日期
|
||
if (Date.parse(val) > Date.parse(new Date()) || Date.parse(val) < Date.parse(this.userInfo.birthday)) {
|
||
this.userInfo.certificateValidate = ''
|
||
this.$refs.certificateValidate.date = ''
|
||
return this.$toast('证件起始日期填写错误')
|
||
}
|
||
|
||
// // 计算年龄
|
||
// if (this.userInfo.idType == '1') {
|
||
// let age = utilsAge.getAge(this.userInfo.birthday, new Date())
|
||
// // 长期按钮是否禁用
|
||
// this.effectiveDateTypeAble = age <= 45
|
||
// }
|
||
}
|
||
break
|
||
case '1': {
|
||
console.log('证件截止日期')
|
||
//证件截止日期
|
||
//如果已经勾选了长期
|
||
if (this.userInfo.effectiveDateType) {
|
||
//清空数据并返回
|
||
this.userInfo.certiexpiredate = ''
|
||
this.$refs.certiexpiredate.date = ''
|
||
return
|
||
}
|
||
this.userInfo.effectiveDateType = false
|
||
//如果录入日期早于当前日期
|
||
if (Date.parse(val) < Date.parse(new Date())) {
|
||
this.userInfo.certiexpiredate = ''
|
||
this.$refs.certiexpiredate.date = ''
|
||
return this.$toast('您的证件已过期')
|
||
}
|
||
//不同证件类型的判断
|
||
// if (this.userInfo.idType) {
|
||
// //获取年龄
|
||
// let age = utilsAge.getAge(this.userInfo.birthday, new Date())
|
||
// console.log(age)
|
||
// //年龄在16-25周岁之间
|
||
// if (age >= 16 && age <= 25) {
|
||
// if (new Date(val).getFullYear() - new Date(this.userInfo.certificateValidate).getFullYear() != 10) {
|
||
// this.userInfo.certiexpiredate = ''
|
||
// this.$refs.certiexpiredate.date = ''
|
||
// return this.$toast('16周岁~25周岁的证件有效期为10年')
|
||
// }
|
||
// //年龄在26-45周岁之间
|
||
// } else if (age >= 26 && age <= 45) {
|
||
// if (new Date(val).getFullYear() - new Date(this.userInfo.certificateValidate).getFullYear() != 20) {
|
||
// this.userInfo.certiexpiredate = ''
|
||
// this.$refs.certiexpiredate.date = ''
|
||
// return this.$toast('26周岁~45周岁的证件有效期为20年')
|
||
// }
|
||
// //此外的年龄段不支持
|
||
// } else {
|
||
// this.userInfo.certiexpiredate = ''
|
||
// this.$refs.certiexpiredate.date = ''
|
||
// return this.$toast('身份证不支持此年龄段')
|
||
// }
|
||
// }
|
||
}
|
||
break
|
||
case '2': {
|
||
//出生日期
|
||
//如果录入日期晚于当前日期
|
||
if (Date.parse(val) > Date.parse(new Date())) {
|
||
this.userInfo.birthday = ''
|
||
this.$refs.birthday.date = ''
|
||
return this.$toast('出生日期不晚于当日')
|
||
}
|
||
// //长判断
|
||
// if (this.userInfo.idType == '1') {
|
||
// let age = utilsAge.getAge(this.userInfo.birthday, new Date())
|
||
// this.effectiveDateTypeAble = !(age >= 45)
|
||
// }
|
||
}
|
||
break
|
||
}
|
||
},
|
||
//选择客户
|
||
chooseCustomer(data) {
|
||
data = data[0]
|
||
console.log(data)
|
||
console.log(typeof this.selectUser)
|
||
|
||
if (this.selectUser == '1') {
|
||
this.customerShowPicker2 = false
|
||
} else {
|
||
this.customerShowPicker = false
|
||
}
|
||
|
||
this.$jump({
|
||
flag: 'navigation',
|
||
extra: {
|
||
title: '填写投保人信息',
|
||
hiddenRight: '1'
|
||
}
|
||
})
|
||
if (this.selectUser == '0') {
|
||
let { customerName, customerSex } = data
|
||
this.userInfo.name = customerName //用户名
|
||
this.userInfo.sex = customerSex ? customerSex.toString() : '0' //性别
|
||
this.userInfo.birthday = data.birthday //出生日期
|
||
this.userInfo.idType = data.customerIdType //证件类型
|
||
this.userInfo.idNo = data.customerIdNumber //证件类别
|
||
if (data.idEffectEndDate == '9999-12-31') {
|
||
this.userInfo.effectiveDateType = true //是否长期
|
||
} else {
|
||
this.userInfo.certiexpiredate = data.idEffectEndDate //证件截止日期
|
||
this.userInfo.effectiveDateType = false //是否长期
|
||
}
|
||
this.userInfo.email = data.email //电子邮箱
|
||
|
||
this.userInfo.mobile = data.customerPhone //移动电话
|
||
this.userInfo.homeProvince = data.homeProvince //家庭省
|
||
this.userInfo.homeCity = data.homeCity //家庭市
|
||
this.userInfo.homeArea = data.homeArea //家庭区
|
||
if (data.homeProvince && data.homeCity && data.homeArea) {
|
||
this.userInfo.homeName = getAreaName([{ code: data.homeProvince }, { code: data.homeCity }, { code: data.homeArea }]) //家庭地址
|
||
}
|
||
this.userInfo.homeAddress = data.homeAddress //家庭详细地址
|
||
// this.userInfo.occupationCode = data.occupationCode
|
||
// this.userInfo.occupationName = data.occupationName
|
||
// this.userInfo.occupationType = data.lifeGrade
|
||
// this.userInfo.lifeGrade = data.lifeGrade
|
||
// this.userInfo.healthGrade = data.healthGrade
|
||
//惠桂保的职业要设置给客户做选择，因之前未保存寿险等级，职业一律清空，重新选择
|
||
this.userInfo.occupationCode = ''
|
||
this.userInfo.occupationName = ''
|
||
this.userInfo.occupationType = ''
|
||
this.userInfo.lifeGrade = ''
|
||
this.userInfo.healthGrade = ''
|
||
this.userInfo.averageAnnualIncome = data.averageYearlyIncome //平均年收入
|
||
this.userInfo.nativeplace = data.country
|
||
this.userInfo.marriage = data.marryStatus
|
||
// 计算年龄
|
||
let age = utilsAge.getAge(this.userInfo.birthday, new Date())
|
||
// 长期按钮是否禁用
|
||
this.effectiveDateTypeAble = age <= 45
|
||
this.userInfo.isNewPeopleFlag = data.isNewPeopleFlag //新市民身份
|
||
this.userInfo.npType = data.npType //新市民类型
|
||
this.getRelatedData(this.userInfo.idNo, '1')
|
||
}
|
||
// console.log(data, val)
|
||
},
|
||
nextStep() {
|
||
this.$validator.validate().then(valid => {
|
||
if (true === valid) {
|
||
// 国富惠桂保团体医疗保险产品,职业不展示，相关字段默认为高风险工作人员
|
||
// this.userInfo.occupationName = '高风险工作人员'
|
||
// this.userInfo.occupationCode = '8000206'
|
||
// this.userInfo.occupationType = '6'
|
||
// this.userInfo.healthGrade = '6'
|
||
// this.userInfo.lifeGrade = '6'
|
||
let age = utilsAge.getAge(this.userInfo.birthday, new Date())
|
||
console.log('计算年龄', age)
|
||
// return
|
||
// 如果是未成年人
|
||
if (age < 18) {
|
||
return this.$toast('亲，投保人年龄必须大于等于18周岁哦~')
|
||
}
|
||
//如果证件类型是身份证
|
||
if (this.userInfo.idType == '1') {
|
||
console.log('证件类型是身份证')
|
||
//校验性别是否与身份证号码位相符
|
||
if (this.userInfo.idNo.length == '15') {
|
||
//15位身份证第15位是性别位, 奇男偶女
|
||
let sexSign = this.userInfo.idNo.substr(14, 1)
|
||
console.log('性别位' + sexSign)
|
||
if ((parseInt(sexSign) % 2 == 0 && this.userInfo.sex != 1) || (parseInt(sexSign) % 2 != 0 && this.userInfo.sex != 0)) {
|
||
return this.$toast('性别录入与身份证不符')
|
||
}
|
||
|
||
//15位身份证第7-12位是生日位, 年月日
|
||
let birthSign = this.userInfo.idNo.substr(6, 6)
|
||
console.log('生日位' + birthSign)
|
||
if (
|
||
this.userInfo.birthday.substr(2, 2) != birthSign.substr(0, 2) ||
|
||
this.userInfo.birthday.substr(5, 2) != birthSign.substr(2, 2) ||
|
||
this.userInfo.birthday.substr(8, 2) != birthSign.substr(4, 2)
|
||
) {
|
||
return this.$toast('生日录入与身份证不符')
|
||
}
|
||
} else 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 (!idNoCheck.isIdno(this.userInfo.idNo)) {
|
||
console.log('证件号码校验有误')
|
||
return this.$toast('您填写的证件号码有误')
|
||
}
|
||
if (age < 46 && this.userInfo.effectiveDateType == true) {
|
||
return this.$toast('证件有效期错误，年龄小于46周岁的公民身份证有效期不能为长期')
|
||
}
|
||
// 年龄在 16-25 周岁之间
|
||
if (age <= 15) {
|
||
if (Date.parse(this.userInfo.certiexpiredate) - Date.parse(new Date()) > Date.parse('1975-01-01')) {
|
||
this.userInfo.certiexpiredate = ''
|
||
this.$refs.certiexpiredate.date = ''
|
||
// this.effectiveDateTypeAble = true
|
||
return this.$toast('证件有效期错误，未满16周岁的公民身份证有效期应小于等于5年')
|
||
}
|
||
//年龄在 16-25 周岁之间
|
||
} else if (age >= 16 && age <= 25) {
|
||
console.log('年龄在16-25周岁之间')
|
||
if (Date.parse(this.userInfo.certiexpiredate) - Date.parse(new Date()) > Date.parse('1980-01-01')) {
|
||
this.userInfo.certiexpiredate = ''
|
||
this.$refs.certiexpiredate.date = ''
|
||
this.effectiveDateTypeAble = true
|
||
return this.$toast('证件有效期不正常，16周岁至25周岁公民身份证有效期应小于等于10年')
|
||
}
|
||
//年龄在 26-45 周岁之间
|
||
} else if (age >= 26 && age <= 45) {
|
||
console.log('年龄在26-45周岁之间')
|
||
if (Date.parse(this.userInfo.certiexpiredate) - Date.parse(new Date()) > Date.parse('1990-01-01')) {
|
||
this.userInfo.certiexpiredate = ''
|
||
this.$refs.certiexpiredate.date = ''
|
||
this.effectiveDateTypeAble = true
|
||
return this.$toast('证件有效期不正常，26周岁至45周岁公民身份证有效期应小于等于20年')
|
||
}
|
||
}
|
||
}
|
||
if (this.manageComCode == '45' && (this.userInfo.isNewPeopleFlag == '' || this.userInfo.isNewPeopleFlag == null || this.userInfo.isNewPeopleFlag == undefined)) {
|
||
return this.$toast('投保人新市民身份不能为空')
|
||
}
|
||
if(this.manageComCode == '45' && this.userInfo.isNewPeopleFlag != '0' && !this.userInfo.npType) {
|
||
return this.$toast('投保人新市民类型不能为空')
|
||
}
|
||
this.infoUpdate()
|
||
// console.log('success')
|
||
} else {
|
||
this.$toast(this.$validator.errors.all()[0])
|
||
}
|
||
})
|
||
},
|
||
//信息变更
|
||
infoUpdate() {
|
||
this.save()
|
||
},
|
||
async save() {
|
||
// console.log('this.riskDTOLst', this.riskDTOLst)
|
||
let params = {
|
||
orderDTO: {
|
||
orderInfoDTO: {
|
||
bnfFlag: '0',
|
||
supportBank: '0',
|
||
orderNo: this.cardOrderNo
|
||
},
|
||
appntDTO: this.userInfo,
|
||
},
|
||
orderType: "CARDGROUP_APPNT_ORDER"
|
||
}
|
||
|
||
let resultData = await saveOrUpdateGroupCard(params)
|
||
if (resultData.result == 0) {
|
||
let cardOrderNo = resultData.content.object.orderNo
|
||
this.$jump({
|
||
flag: 'h5',
|
||
extra: {
|
||
url: location.origin + `/#/cardList/GroupInsuredList?cardOrderNo=${cardOrderNo}`,
|
||
forbidSwipeBack: 1
|
||
},
|
||
routerInfo: {
|
||
path: `/cardList/GroupInsuredList?cardOrderNo=${cardOrderNo}`
|
||
}
|
||
})
|
||
console.log('resultData.orderNo', resultData.content.object)
|
||
} else {
|
||
console.error(resultData.resultMessage)
|
||
this.$toast(resultData.resultMessage)
|
||
}
|
||
},
|
||
//区域选择
|
||
sureArea(area, type) {
|
||
switch (type) {
|
||
case '1': //单位地址
|
||
this.areaName = getAreaName(area)
|
||
;[this.userInfo.companyProvince, this.userInfo.companyCity, this.userInfo.companyArea] = [area[0].code, area[1].code, area[2].code]
|
||
this.areaShow = false
|
||
break
|
||
case '2': //家庭地址
|
||
if (this.insureType === '1') {
|
||
this.userInfo.homeName = getAreaName(area)
|
||
;[this.userInfo.homeProvince, this.userInfo.homeCity, this.userInfo.homeArea] = [area[0].code, area[1].code, area[2].code]
|
||
this.homeShow = false
|
||
}
|
||
break
|
||
case '3': //户籍
|
||
this.census = getAreaName(area)
|
||
;[this.userInfo.householdProvince, this.userInfo.householdCity] = [area[0].code, area[1].code]
|
||
this.censusShow = false
|
||
break
|
||
}
|
||
},
|
||
//获取身份证扫描信息
|
||
getIdentityInfo(data) {
|
||
getIdentityInfo(this, data, this.insureType)
|
||
},
|
||
// getIdentityInfo(data) {
|
||
// console.log(data)
|
||
// if (data.name && data.name != '待识别') {
|
||
// this.userInfo.certificateValidate = `${data.startDate.substr(0, 4)}-${data.startDate.substr(5, 2)}-${data.startDate.substr(8, 2)}`
|
||
// this.userInfo.certiexpiredate = `${data.endDate.substr(0, 4)}-${data.endDate.substr(5, 2)}-${data.endDate.substr(8, 2)}`
|
||
// this.userInfo.name = data.name
|
||
// this.userInfo.idNo = data.idNo
|
||
// this.userInfo.birthday = `${data.birthYear}-${data.birthMonth}-${data.birthDay}`
|
||
// this.userInfo.sex = data.gender == '男' ? '0' : '1'
|
||
// }
|
||
// this.isScan = false
|
||
// this.$jump({
|
||
// flag: 'navigation',
|
||
// extra: {
|
||
// title: '填写投保人信息',
|
||
// hiddenRight: '1'
|
||
// }
|
||
// })
|
||
// },
|
||
getRelatedData(val, ind) {
|
||
//ind 1 投保人 2 被保人
|
||
if (ind == '1') {
|
||
if (this.userInfo.idType != '1') {
|
||
return
|
||
}
|
||
//如果证件校验不通过,恢复默认值
|
||
if (idToData(val).text) {
|
||
;[this.userInfo.idNo, this.userInfo.sex, this.userInfo.birthday, this.effectiveDateTypeAble] = ['', '0', '', false]
|
||
return this.$toast(idToData(val).text)
|
||
}
|
||
this.userInfo.birthday = idToData(val).birthday
|
||
this.userInfo.sex = idToData(val).sex
|
||
if (idToData(val).age > 45) {
|
||
this.effectiveDateTypeAble = false
|
||
}
|
||
}
|
||
}
|
||
},
|
||
// beforeDestroy() {
|
||
// //清理计时器
|
||
// console.log('123')
|
||
// window.clearInterval(this.timeId)
|
||
// this.timeId = null
|
||
// this.countDown = 60
|
||
// this.codeDisabled = false
|
||
// },
|
||
watch: {}
|
||
}
|
||
</script>
|
||
<style lang='scss'>
|
||
// *{ touch-action: none; }
|
||
.insured-info-container {
|
||
/deep/ .van-checkbox {
|
||
margin-left: auto;
|
||
align-items: normal;
|
||
|
||
.van-checkbox__icon {
|
||
margin-top: 5px;
|
||
}
|
||
}
|
||
|
||
/deep/ .van-radio {
|
||
margin-left: auto;
|
||
}
|
||
}
|
||
|
||
.van-checkbox__label {
|
||
font-size: 13px;
|
||
}
|
||
|
||
.tips {
|
||
font-size: 14px;
|
||
color: #333;
|
||
padding: 15px;
|
||
}
|
||
|
||
.address {
|
||
display: flex;
|
||
flex-direction: row-reverse;
|
||
}
|
||
</style>
|