hz/ebiz-h5
1
0
Fork 0
mirror of http://112.124.100.131/GFRS/ebiz-h5.git synced 2025-12-12 14:56:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

在家属信息页面录入后，点击【下一步】做提示，如果家属角色为父亲，选择性别为女，则提示父亲性别不可为女，母亲同此规则

Browse Source
This commit is contained in:
liyuetong
2021-08-25 17:33:03 +08:00
parent 3e01ad285b
commit cf93e23f1a
1 changed files with 205 additions and 209 deletions
Download Patch File Download Diff File Expand all files Collapse all files

326
src/views/ebiz/agentEenter/AgentEenterBasicFamily.vue
View File

@@ -1,132 +1,126 @@
<template> <template>
<div class='insured-info-container pb50'> <div class="insured-info-container pb50">
<!-- 基本信息 --> <!-- 基本信息 -->
<van-cell-group> <van-cell-group>
<RsTop :active="['1', '2', '3']"></RsTop> <RsTop :active="['1', '2', '3']"></RsTop>
<p class='fs15 fwb pl10 pv12'>家庭情况</p> <p class="fs15 fwb pl10 pv12">家庭情况</p>
<!-- start --> <!-- start -->
<van-checkbox-group v-model='checkedRelationshipList'> <van-checkbox-group v-model="checkedRelationshipList">
<div v-for='(item, i) in userInfo' :key='i'> <div v-for="(item, i) in userInfo" :key="i">
<van-field <van-field
:value="item.relationType | idToText('agentEenterBasicFamilyRelationType')" :value="item.relationType | idToText('agentEenterBasicFamilyRelationType')"
v-validate="'required'" v-validate="'required'"
readonly readonly
label='关系' label="关系"
name='关系' name="关系"
right-icon='arrow' right-icon="arrow"
placeholder='请选择' placeholder="请选择"
:required='!!item.requiredType' :required="!!item.requiredType"
:disabled='!item.requiredType' :disabled="!item.requiredType"
/> />
<van-field <van-field
label='姓名' label="姓名"
type='name' type="name"
name='姓名' name="姓名"
placeholder='请输入' placeholder="请输入"
v-validate='{ required: !!item.requiredType, name: true }' v-validate="{ required: !!item.requiredType, name: true }"
clearable clearable
v-model='item.name' v-model="item.name"
:required='!!item.requiredType' :required="!!item.requiredType"
:disabled='!item.requiredType' :disabled="!item.requiredType"
/> />
<select-radio <select-radio
:value.sync='item.sex' :value.sync="item.sex"
:radios='sexRadio' :radios="sexRadio"
label='性别' label="性别"
name='性别' name="性别"
v-validate='{ required: !!item.requiredType }' v-validate="{ required: !!item.requiredType }"
:required='!!item.requiredType' :required="!!item.requiredType"
:disabled='!item.requiredType' :disabled="!item.requiredType"
></select-radio> ></select-radio>
<van-field <van-field
:value="item.idType | idToText('rsIdType')" :value="item.idType | idToText('rsIdType')"
readonly readonly
label='证件类型' label="证件类型"
name='证件类型' name="证件类型"
right-icon='arrow' right-icon="arrow"
placeholder='请选择' placeholder="请选择"
@click="toSelect('2', i, item)" @click="toSelect('2', i, item)"
v-validate='{ required: !!item.requiredType }' v-validate="{ required: !!item.requiredType }"
:required='!!item.requiredType' :required="!!item.requiredType"
:disabled='!item.requiredType' :disabled="!item.requiredType"
/> />
<van-field <van-field
label='证件号码' label="证件号码"
type='text' type="text"
name='证件号码' name="证件号码"
placeholder='请输入' placeholder="请输入"
clearable clearable
v-model='item.idNo' v-model="item.idNo"
v-validate='{ required: !!item.requiredType }' v-validate="{ required: !!item.requiredType }"
:required='!!item.requiredType' :required="!!item.requiredType"
:disabled='!item.requiredType' :disabled="!item.requiredType"
maxlength='18' maxlength="18"
@blur="getRelatedData(item, '1')" @blur="getRelatedData(item, '1')"
/> />
<FieldDatePicter <FieldDatePicter
label='出生日期' label="出生日期"
name='出生日期' name="出生日期"
:value.sync='item.birthday' :value.sync="item.birthday"
type='date' type="date"
:flag='true' :flag="true"
ref='birthday' ref="birthday"
v-validate='{ required: !!item.requiredType }' v-validate="{ required: !!item.requiredType }"
:required='!!item.requiredType' :required="!!item.requiredType"
:disabled='!item.requiredType' :disabled="!item.requiredType"
></FieldDatePicter> ></FieldDatePicter>
<van-field <van-field
v-model='item.mobile' v-model="item.mobile"
label='联系电话' label="联系电话"
name='联系电话' name="联系电话"
placeholder='请输入' placeholder="请输入"
type='mobile' type="mobile"
v-validate='{ required: !!item.requiredType, mobile: true }' v-validate="{ required: !!item.requiredType, mobile: true }"
maxlength='11' maxlength="11"
:required='!!item.requiredType' :required="!!item.requiredType"
:disabled='!item.requiredType' :disabled="!item.requiredType"
clearable clearable
/> />
<p class='mv8 p8 bg-gray'> <p class="mv8 p8 bg-gray">
<van-checkbox :name='i' v-show="item.relationType != '0'" @click='notHaveImmediateFamilyFunc(item,i)' <van-checkbox :name="i" v-show="item.relationType != '0'" @click="notHaveImmediateFamilyFunc(item, i)" checked-color="#ee0a24"
checked-color='#ee0a24'>无此直系亲属 >无此直系亲属
</van-checkbox> </van-checkbox>
</p> </p>
</div> </div>
</van-checkbox-group> </van-checkbox-group>
<div class='add-btn mt20 pb20 text-center p15 c-gray-base' @click='add'>+ <div class="add-btn mt20 pb20 text-center p15 c-gray-base" @click="add">+ 新增</div>
新增
</div>
<!-- end --> <!-- end -->
<div class='flex justify-content-s bottom-btn bg-white'> <div class="flex justify-content-s bottom-btn bg-white">
<van-button class=' bottom0 left0' square plain type='danger' v-no-more-click='1000' @click='goBack' <van-button class="bottom0 left0" square plain type="danger" v-no-more-click="1000" @click="goBack" size="large">上一步 </van-button>
size='large'>上一步 <van-button class="bottom0 left0" square type="danger" size="large" @click="nextStep" v-no-more-click="1000"> 下一步 </van-button>
</van-button>
<van-button class=' bottom0 left0' square type='danger' size='large' @click='nextStep' v-no-more-click='1000'>
下一步
</van-button>
</div> </div>
</van-cell-group> </van-cell-group>
<!-- 字段选择 --> <!-- 字段选择 -->
<van-popup v-model='popupShow' position='bottom'> <van-popup v-model="popupShow" position="bottom">
<van-picker show-toolbar :columns='columns' @confirm='onConfirm' @cancel='popupShow = false' /> <van-picker show-toolbar :columns="columns" @confirm="onConfirm" @cancel="popupShow = false" />
</van-popup> </van-popup>
</div> </div>
</template> </template>
<script> <script>
import { Field, CellGroup, Button, col, popup, picker, Dialog, Checkbox, CheckboxGroup } from 'vant'; import { Field, CellGroup, Button, col, popup, picker, Dialog, Checkbox, CheckboxGroup } from 'vant'
import SelectRadio from '@/components/ebiz/SelectRadio'; import SelectRadio from '@/components/ebiz/SelectRadio'
import FieldDatePicter from '@/components/ebiz/FieldDatePicter'; import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
import DataDictionary from '@/assets/js/utils/data-dictionary'; import DataDictionary from '@/assets/js/utils/data-dictionary'
import RsTop from '@/components/ebiz/agentEenter/RsTop'; import RsTop from '@/components/ebiz/agentEenter/RsTop'
import idNoCheck from '@/assets/js/utils/idNoCheck'; import idNoCheck from '@/assets/js/utils/idNoCheck'
import beforeDate from '@/assets/js/utils/getBeforeDate.js'; import beforeDate from '@/assets/js/utils/getBeforeDate.js'
import { saveOrUpdateInfo, agentAll } from '@/api/ebiz/agentEenter/agentEenter'; import { saveOrUpdateInfo, agentAll } from '@/api/ebiz/agentEenter/agentEenter'
import {idToData} from "../cardList/js/verification"; import { idToData } from '../cardList/js/verification'
// 是否存在亲属关系的枚举值 // 是否存在亲属关系的枚举值
const immediateFamilyEnum = { const immediateFamilyEnum = {
existence: 1, // 存在亲属关系 existence: 1, // 存在亲属关系
nonExistent: 0 // 不存在亲属关系 nonExistent: 0 // 不存在亲属关系
}; }
export default { export default {
name: 'AgentEenterBasicFamily', name: 'AgentEenterBasicFamily',
components: { components: {
@@ -143,7 +137,6 @@ export default {
[CheckboxGroup.name]: CheckboxGroup [CheckboxGroup.name]: CheckboxGroup
}, },
data() { data() {
return { return {
popupShow: false, popupShow: false,
enterIndex: '', enterIndex: '',
@@ -259,19 +252,19 @@ export default {
checkedRelationshipList: [], // 定义一个数组集合，储存当前是哪个对象勾选了‘无此亲属关系’选项 checkedRelationshipList: [], // 定义一个数组集合，储存当前是哪个对象勾选了‘无此亲属关系’选项
sexDisabled: false, sexDisabled: false,
ebizEnterCustomerDto: {} //本人信息 ebizEnterCustomerDto: {} //本人信息
}; }
}, },
mounted() { mounted() {
Dialog.alert({ Dialog.alert({
message: '请如实填写下列各项内容，直系亲属为本人父母、子女或配偶，其余亲属不属于直系亲属。如有不实，后果自负。' message: '请如实填写下列各项内容，直系亲属为本人父母、子女或配偶，其余亲属不属于直系亲属。如有不实，后果自负。'
}).then(() => { }).then(() => {
this.agentAll(); this.agentAll()
}); })
document.body.style.backgroundColor = '#fff'; document.body.style.backgroundColor = '#fff'
}, },
beforeRouteLeave(to, from, next) { beforeRouteLeave(to, from, next) {
document.body.style.backgroundColor = ''; document.body.style.backgroundColor = ''
next(); next()
}, },
methods: { methods: {
goBack() { goBack() {
@@ -287,55 +280,55 @@ export default {
index: -1, index: -1,
path: '/agentEenter/AgentEnterGuarantor' path: '/agentEenter/AgentEnterGuarantor'
} }
}); })
}, },
//信息返显 //信息返显
agentAll() { agentAll() {
let that = this; let that = this
that.$toast.loading({ that.$toast.loading({
duration: 0, // 持续展示 toast duration: 0, // 持续展示 toast
forbidClick: true, // 禁用背景点击 forbidClick: true, // 禁用背景点击
loadingType: 'spinner', loadingType: 'spinner',
message: '加载中……' message: '加载中……'
}); })
let data = {}; let data = {}
agentAll(data).then(res => { agentAll(data).then((res) => {
if (res.result == '0') { if (res.result == '0') {
localStorage.removeItem('marriageEnumInfo'); localStorage.removeItem('marriageEnumInfo')
localStorage.setItem('marriageEnumInfo', res.content.ebizEnterCustomerDto.marriage); localStorage.setItem('marriageEnumInfo', res.content.ebizEnterCustomerDto.marriage)
this.ebizEnterCustomerDto = res.content.ebizEnterCustomerDto this.ebizEnterCustomerDto = res.content.ebizEnterCustomerDto
if (res.content.ebizRelationDtoLst.length != 0) { if (res.content.ebizRelationDtoLst.length != 0) {
let result = res.content.ebizRelationDtoLst; let result = res.content.ebizRelationDtoLst
if (result) { if (result) {
// 重置情况变量，防止数据有缓存 // 重置情况变量，防止数据有缓存
that.checkedRelationshipList = []; that.checkedRelationshipList = []
result.map(item => { result.map((item) => {
delete item.id; delete item.id
delete item.baseId; delete item.baseId
delete item.createdDate; delete item.createdDate
delete item.createdUser; delete item.createdUser
delete item.isDelete; delete item.isDelete
delete item.modifiedDate; delete item.modifiedDate
delete item.modifiedUser; delete item.modifiedUser
// 判断数据中的‘checkedIndex’属性是否有对应数据， // 判断数据中的‘checkedIndex’属性是否有对应数据，
// 如果有数据，则获取数据存储到储存当前是哪个对象勾选了‘无此亲属关系’选项的集合中，用于回显勾选了‘无此亲属关系’的选项 // 如果有数据，则获取数据存储到储存当前是哪个对象勾选了‘无此亲属关系’选项的集合中，用于回显勾选了‘无此亲属关系’的选项
if (item.checkedIndex != null) { if (item.checkedIndex != null) {
that.checkedRelationshipList.push(item.checkedIndex); that.checkedRelationshipList.push(item.checkedIndex)
} }
}); })
that.userInfo = result; that.userInfo = result
} }
} else { } else {
that.userInfo = []; that.userInfo = []
// 根据基本信息中‘婚姻状态’的不同，赋值不同的数据 // 根据基本信息中‘婚姻状态’的不同，赋值不同的数据
if (res.content.ebizEnterCustomerDto.marriage == '5') { if (res.content.ebizEnterCustomerDto.marriage == '5') {
that.userInfo = that.userInfoMarried; that.userInfo = that.userInfoMarried
} else { } else {
that.userInfo = that.userInfoNotMarried; that.userInfo = that.userInfoNotMarried
} }
} }
} }
}); })
}, },
/** /**
@@ -349,34 +342,36 @@ export default {
toSelect(pickerType, index, data) { toSelect(pickerType, index, data) {
if (data.requiredType) { if (data.requiredType) {
//pickerType 1、证件类型 2、民族 3、健康状况 4 婚姻状况 5 政治面貌 //pickerType 1、证件类型 2、民族 3、健康状况 4 婚姻状况 5 政治面貌
[this.popupShow, this.pickerType] = [true, pickerType]; ;[this.popupShow, this.pickerType] = [true, pickerType]
this.enterIndex = index; this.enterIndex = index
if (pickerType == '1') { if (pickerType == '1') {
this.columns = DataDictionary.agentEenterBasicFamilyRelationType; this.columns = DataDictionary.agentEenterBasicFamilyRelationType
} }
if (pickerType == '2') { if (pickerType == '2') {
this.columns = DataDictionary.rsIdType; this.columns = DataDictionary.rsIdType
} }
} else { } else {
return false; return false
} }
}, },
onConfirm(value) { onConfirm(value) {
this.popupShow = false; this.popupShow = false
if (this.pickerType == '1') { if (this.pickerType == '1') {
this.userInfo[this.enterIndex].relationType = value.id; this.userInfo[this.enterIndex].relationType = value.id
} }
if (this.pickerType == '2') { if (this.pickerType == '2') {
this.userInfo[this.enterIndex].idType = value.id; this.userInfo[this.enterIndex].idType = value.id
} }
}, },
// 下一步 // 下一步
nextStep() { nextStep() {
//表单校验, 成功跳转 //表单校验, 成功跳转
this.$validator.validate().then(valid => { this.$validator.validate().then((valid) => {
if (true === valid) { if (true === valid) {
console.log(this.userInfo, 'this.userInfo')
for (let i = 0; i < this.userInfo.length; i++) { for (let i = 0; i < this.userInfo.length; i++) {
let item = this.userInfo[i] let item = this.userInfo[i]
if (item.requiredType == 1) {
//在家属信息页面录入后，点击【下一步】做提示，如果家属角色为父亲，选择性别为女，则提示“父亲性别不可为女”，母亲同此规则 //在家属信息页面录入后，点击【下一步】做提示，如果家属角色为父亲，选择性别为女，则提示“父亲性别不可为女”，母亲同此规则
//0 男 1 女 relationType:0 配偶 1 父亲 2 母亲 //0 男 1 女 relationType:0 配偶 1 父亲 2 母亲
if (item.sex == 1 && item.relationType == 1) { if (item.sex == 1 && item.relationType == 1) {
@@ -393,12 +388,12 @@ export default {
} }
if (item.idType == '1') { if (item.idType == '1') {
//身份证 //身份证
console.log('证件类型是身份证'); console.log('证件类型是身份证')
// 证件号码规则校验 // 证件号码规则校验
if (!idNoCheck.isIdno(item.idNo)) { if (!idNoCheck.isIdno(item.idNo)) {
this.idCardFlag = false; this.idCardFlag = false
} else { } else {
this.idCardFlag = true; this.idCardFlag = true
} }
if (item.idNo.length == '18') { if (item.idNo.length == '18') {
//18位身份证第17位是性别位, 奇男偶女 //18位身份证第17位是性别位, 奇男偶女
@@ -419,51 +414,52 @@ export default {
} }
} }
} }
}
// 循环存储勾选了‘无此亲属关系’选项的数组，给‘userInfo’的集合所对应的对象中添加一个新的字段，用于回显勾选了‘无此亲属关系’的选项 // 循环存储勾选了‘无此亲属关系’选项的数组，给‘userInfo’的集合所对应的对象中添加一个新的字段，用于回显勾选了‘无此亲属关系’的选项
this.checkedRelationshipList.forEach(item => { this.checkedRelationshipList.forEach((item) => {
this.userInfo[item].checkedIndex = item; this.userInfo[item].checkedIndex = item
}); })
if (this.idCardFlag && this.bookletFlag && this.birthFlag && this.passportFlag && this.gatPass && this.twPass) { if (this.idCardFlag && this.bookletFlag && this.birthFlag && this.passportFlag && this.gatPass && this.twPass) {
this.save(); this.save()
} else { } else {
if (!this.idCardFlag) { if (!this.idCardFlag) {
this.$toast('您填写的证件号码有误'); this.$toast('您填写的证件号码有误')
} else if (!this.bookletFlag) { } else if (!this.bookletFlag) {
this.$toast('户口本的证件号码长度应等于18位'); this.$toast('户口本的证件号码长度应等于18位')
} else if (!this.birthFlag) { } else if (!this.birthFlag) {
this.$toast('出生证须大于等于3个字符'); this.$toast('出生证须大于等于3个字符')
} else if (!this.passportFlag) { } else if (!this.passportFlag) {
this.$toast('护照须大于等于3个字符'); this.$toast('护照须大于等于3个字符')
} else if (!this.gatPass) { } else if (!this.gatPass) {
if (!this.gtFlag1) { if (!this.gtFlag1) {
this.$toast('证件类型为港澳居民通行证的，证件号码须为9位'); this.$toast('证件类型为港澳居民通行证的，证件号码须为9位')
} else if (!this.gtFlag2) { } else if (!this.gtFlag2) {
this.$toast('证件类型为港澳居民通行证的，证件号码首位字母为"H"/"M",证件号码第2位至第9位为阿拉伯数字'); this.$toast('证件类型为港澳居民通行证的，证件号码首位字母为"H"/"M",证件号码第2位至第9位为阿拉伯数字')
} }
} else if (!this.twPass) { } else if (!this.twPass) {
this.$toast('证件类型为台湾居民通行证的，证件号码须为8位数字'); this.$toast('证件类型为台湾居民通行证的，证件号码须为8位数字')
} }
} }
} else { } else {
this.$toast(this.$validator.errors.all()[0]); this.$toast(this.$validator.errors.all()[0])
} }
}); })
}, },
save() { save() {
let that = this; let that = this
that.$toast.loading({ that.$toast.loading({
duration: 0, // 持续展示 toast duration: 0, // 持续展示 toast
forbidClick: true, // 禁用背景点击 forbidClick: true, // 禁用背景点击
loadingType: 'spinner', loadingType: 'spinner',
message: '加载中……' message: '加载中……'
}); })
let params = { let params = {
entryType: 'CUSTOMER_RELATION', entryType: 'CUSTOMER_RELATION',
ebizRelationDtoLst: {} ebizRelationDtoLst: {}
}; }
params.ebizRelationDtoLst = that.userInfo; params.ebizRelationDtoLst = that.userInfo
saveOrUpdateInfo(params).then(res => { saveOrUpdateInfo(params).then((res) => {
that.$toast.clear(); that.$toast.clear()
if (res.result == '0') { if (res.result == '0') {
this.$jump({ this.$jump({
flag: 'h5', flag: 'h5',
@@ -473,11 +469,11 @@ export default {
routerInfo: { routerInfo: {
path: `/agentEenter/AgentEenterBasicImage` path: `/agentEenter/AgentEenterBasicImage`
} }
}); })
} else { } else {
this.$toast(res.resultMessage); this.$toast(res.resultMessage)
} }
}); })
}, },
/** /**
@@ -490,22 +486,22 @@ export default {
notHaveImmediateFamilyFunc(item) { notHaveImmediateFamilyFunc(item) {
if (item.requiredType) { if (item.requiredType) {
// 当前‘requiredType’属性为true时，执行此操作，要勾选‘无此直系亲属’选项。表示不存在亲属关系，勾选‘无此直系亲属’选项时，要将输入项重置 // 当前‘requiredType’属性为true时，执行此操作，要勾选‘无此直系亲属’选项。表示不存在亲属关系，勾选‘无此直系亲属’选项时，要将输入项重置
item.name = ''; // 将对应数据对象中的姓名设置为空 item.name = '' // 将对应数据对象中的姓名设置为空
item.sex = 0; // 将对应数据对象中的性别设置为默认的‘男’ item.sex = 0 // 将对应数据对象中的性别设置为默认的‘男’
item.idType = ''; // 将对应数据对象中的证件类型设置为空 item.idType = '' // 将对应数据对象中的证件类型设置为空
item.idNo = ''; // 将对应数据对象中的证件号码设置为空 item.idNo = '' // 将对应数据对象中的证件号码设置为空
item.birthday = ''; // 将对应数据对象中的出生日期设置为空 item.birthday = '' // 将对应数据对象中的出生日期设置为空
item.mobile = ''; // 将对应数据对象中的联系号码设置为空 item.mobile = '' // 将对应数据对象中的联系号码设置为空
item.requiredType = immediateFamilyEnum.nonExistent; // 将对应数据对象中的是否必填设置为false，表示设置输入项为非必填 item.requiredType = immediateFamilyEnum.nonExistent // 将对应数据对象中的是否必填设置为false，表示设置输入项为非必填
} else { } else {
// 当前‘requiredType’属性为false时，执行此操作，要将已经选中的‘无此直系亲属’选项进行取消勾选，表示存在亲属关系 // 当前‘requiredType’属性为false时，执行此操作，要将已经选中的‘无此直系亲属’选项进行取消勾选，表示存在亲属关系
item.name = ''; // 将对应数据对象中的姓名设置为空 item.name = '' // 将对应数据对象中的姓名设置为空
item.sex = 0; // 将对应数据对象中的性别设置为默认的‘男’ item.sex = 0 // 将对应数据对象中的性别设置为默认的‘男’
item.idType = ''; // 将对应数据对象中的证件类型设置为空 item.idType = '' // 将对应数据对象中的证件类型设置为空
item.idNo = ''; // 将对应数据对象中的证件号码设置为空 item.idNo = '' // 将对应数据对象中的证件号码设置为空
item.birthday = ''; // 将对应数据对象中的出生日期设置为空 item.birthday = '' // 将对应数据对象中的出生日期设置为空
item.mobile = ''; // 将对应数据对象中的联系号码设置为空 item.mobile = '' // 将对应数据对象中的联系号码设置为空
item.requiredType = immediateFamilyEnum.existence; // 将对应数据对象中的是否必填设置为true，表示输入项都是要必填 item.requiredType = immediateFamilyEnum.existence // 将对应数据对象中的是否必填设置为true，表示输入项都是要必填
} }
}, },
@@ -524,7 +520,7 @@ export default {
birthday: '', // 出生日期 birthday: '', // 出生日期
mobile: '', // 联系电话 mobile: '', // 联系电话
requiredType: immediateFamilyEnum.existence // 是否必填 requiredType: immediateFamilyEnum.existence // 是否必填
}); })
}, },
getRelatedData(val, ind) { getRelatedData(val, ind) {
if (ind == '1') { if (ind == '1') {
@@ -551,7 +547,7 @@ export default {
} }
} }
} }
}; }
</script> </script>
<style lang='scss' scoped> <style lang='scss' scoped>
.insured-info-container { .insured-info-container {