mirror of
http://112.124.100.131/GFRS/ebiz-h5.git
synced 2025-12-16 05:16:44 +08:00
331 lines
11 KiB
Vue
331 lines
11 KiB
Vue
<!--受益人变更页面-->
|
||
<template>
|
||
<div class="beneficiary-container">
|
||
<div h10></div>
|
||
<div class="fs14 flex justify-content-s pv12 ph15 van-hairline--bottom">
|
||
<label class="c-gray-dark">被保险人</label>
|
||
<span class="c-gray-darker">{{ insuredName }}</span>
|
||
</div>
|
||
<div class="fs14 pv12 ph15 van-hairline--bottom flex">
|
||
<label class="c-gray-dark">身故受益人</label>
|
||
<div class="ml20 c-gray-darker">
|
||
<van-radio-group :disabled="isDisType" v-model="type" class="flex">
|
||
<van-radio name="1">法定受益人</van-radio>
|
||
<van-radio name="2" class="ml10">指定受益人</van-radio>
|
||
</van-radio-group>
|
||
</div>
|
||
</div>
|
||
<!-- 受益人列表 -->
|
||
<div class="fs14 beneficiary-list" v-if="type == 2">
|
||
<ul>
|
||
<li class="ph15 item" v-for="(item, index) in beneficiariesNew" :key="index">
|
||
<div class="bg-white p15" v-if="item.name">
|
||
<div class="flex justify-content-s c-gray-darker">
|
||
<div>
|
||
<img src="@/assets/images/bnf_avatar.png" width="40" height="40" class="radius50 v-middle" />
|
||
<span class="ml10 c-gray-base">{{ item.name }}</span>
|
||
</div>
|
||
<div>
|
||
<van-icon name="delete" class="mr20" size="20" @click="deleteBeneficiary(index)" />
|
||
<van-icon name="edit" size="20" @click="editBeneficiary(index)" />
|
||
</div>
|
||
</div>
|
||
<p class="mt20">
|
||
<span class="c-gray-dark">是被保险人的</span>
|
||
<span class="ml20">{{ item.relationToInsured | idToText('edorRelationToAppnt') }}</span>
|
||
</p>
|
||
<p class="mt10">
|
||
<span class="c-gray-dark">受益份额</span>
|
||
<span class="ml35">{{ item.bnfLot }}%</span>
|
||
</p>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
<div class="add-btn mt20 text-center p15 c-gray-base" @click="add">+ 添加指定受益人</div>
|
||
</div>
|
||
<van-button type="danger" class="bottom-btn" @click="nextStep">下一步</van-button>
|
||
|
||
<!-- 错误提示弹窗 -->
|
||
<div class="dialog-container">
|
||
<van-dialog v-model="dialogShow" title="提示" @confirm="dialogShow = false" confirmButtonColor="#fff">
|
||
<p class="p15 pb20 fs14 text-center">当前顺位受益比例总和不等于100%</p>
|
||
</van-dialog>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { RadioGroup, Radio, Icon, Dialog } from 'vant'
|
||
import { changeEdor, policyInfo } from '@/api/ebiz/preserve/preserve'
|
||
import filters from '@/views/ebiz/preserve/filters'
|
||
import businessCommon from '../js/business-common'
|
||
|
||
export default {
|
||
name: 'BeneficiaryInfo',
|
||
components: {
|
||
[RadioGroup.name]: RadioGroup,
|
||
[Radio.name]: Radio,
|
||
[Icon.name]: Icon,
|
||
[Dialog.name]: Dialog
|
||
},
|
||
data() {
|
||
return {
|
||
riskList: [],
|
||
dialogShow: false, //错误弹窗是否显示
|
||
type: '',
|
||
isDisType: false,
|
||
policy: null,
|
||
customerInfo: {}, //客户详情
|
||
insuredName: '', //被保险人
|
||
beneficiariesOld: [], // 变更前指定受益人列表
|
||
beneficiariesNew: [] // 变更后指定受益人列表
|
||
}
|
||
},
|
||
async created() {
|
||
// 获取保单列表存储的数据
|
||
this.customerInfo = JSON.parse(localStorage['preserve-customerInfo']) //客户详情
|
||
this.policy = JSON.parse(localStorage['preserve-policy'])
|
||
if (localStorage.fromAddBC) {
|
||
this.beneficiariesNew = this.policy.bnfDTOs.beneficiariesNew
|
||
this.beneficiariesOld = this.policy.bnfDTOs.beneficiariesOld
|
||
this.type = this.beneficiariesNew.some(i => {
|
||
//isLegal:法定标记 1-是法定受益人 0-是指定受益人
|
||
return i.isNewInfo == '0' && i.isLegal == '0' //新增受益人存在指定受益人
|
||
})
|
||
? '2'
|
||
: '1'
|
||
} else {
|
||
await this.getPolicyInfo()
|
||
this.type = this.beneficiariesOld.some(i => {
|
||
return i.isNewInfo == '1' && i.isLegal == '0' //初始化受益人存在指定受益人
|
||
})
|
||
? '2'
|
||
: '1'
|
||
if (this.type == '1') {
|
||
this.beneficiariesNew = []
|
||
}
|
||
}
|
||
this.insuredName = this.policy.insuredName
|
||
if (this.type == 2) {
|
||
this.isDisType = true
|
||
}
|
||
},
|
||
mounted() {},
|
||
methods: {
|
||
//获取初始化信息
|
||
getPolicyInfo() {
|
||
let data = {
|
||
contNo: this.policy.contNo,
|
||
edorType: 'BC',
|
||
customerNo: this.customerInfo.customerNo,
|
||
idno: this.customerInfo.idNo,
|
||
mobile: this.customerInfo.mobile
|
||
}
|
||
return new Promise((resolve, reject) => {
|
||
policyInfo(data).then(
|
||
res => {
|
||
if (res.result == '0') {
|
||
res.content.cont.bcBnfList.forEach(item => {
|
||
//isNewInfo 是否新信息 0-是 1-否
|
||
item.isNewInfo = '1'
|
||
})
|
||
this.beneficiariesOld = [...res.content.cont.bcBnfList]
|
||
this.beneficiariesNew = [...res.content.cont.bcBnfList]
|
||
this.riskList = res.content.cont.riskList
|
||
this.policy.appntInfo = res.content.cont.appnt //投保人信息
|
||
this.policy.insuredInfo = res.content.cont.insuredList[0] //被保险人信息
|
||
localStorage['preserve-policy'] = JSON.stringify(this.policy)
|
||
resolve()
|
||
} else {
|
||
reject(this.$toast(res.resultMessage))
|
||
}
|
||
},
|
||
error => {
|
||
reject(console.log(error))
|
||
}
|
||
)
|
||
})
|
||
},
|
||
//下一步
|
||
nextStep() {
|
||
let checkIdExpDate = true, //校验证件有效期是否过期 true-已过期 false-未过期
|
||
overdueName = ''
|
||
if (this.type == 2 && this.beneficiariesNew.length < 1) {
|
||
this.$toast('受益人列表不能为空')
|
||
return
|
||
} else if (this.beneficiariesNew.length > 0) {
|
||
checkIdExpDate = this.beneficiariesNew.some(i => {
|
||
overdueName = i.name
|
||
return Date.parse(i.idExpDate) < Date.parse(new Date())
|
||
})
|
||
} else {
|
||
checkIdExpDate = false
|
||
}
|
||
if (checkIdExpDate) {
|
||
return this.$toast(`受益人${overdueName}的身份证件已过期`)
|
||
}
|
||
let beneRatio = 0
|
||
this.beneficiariesNew.forEach(item => {
|
||
beneRatio += Number(item.bnfLot)
|
||
})
|
||
if (beneRatio != 100 && this.type == 2) {
|
||
return (this.dialogShow = true)
|
||
}
|
||
let beneficiaries = [...this.beneficiariesOld, ...this.beneficiariesNew]
|
||
beneficiaries = businessCommon.unrepeatObj(beneficiaries, 'idNo')
|
||
beneficiaries.forEach(i => {
|
||
i.contNo = this.policy.contNo
|
||
})
|
||
let feachData = {
|
||
platformType: 'app',
|
||
edorType: 'BC',
|
||
operateType: '01',
|
||
bcBnfDTOList: beneficiaries
|
||
}
|
||
changeEdor(feachData).then(
|
||
res => {
|
||
if (res.result == 0) {
|
||
this.policy.bnfDTOs = {
|
||
beneficiariesOld: this.beneficiariesOld,
|
||
beneficiariesNew: this.beneficiariesNew
|
||
}
|
||
localStorage['preserve-policy'] = JSON.stringify(this.policy)
|
||
this.customerInfo.surrenderId = res.content.surrenderId
|
||
this.customerInfo.edorApplyNo = res.content.edorApplyNo
|
||
localStorage.setItem('preserve-customerInfo', JSON.stringify(this.customerInfo))
|
||
localStorage.setItem('preserve-policy', JSON.stringify(this.policy))
|
||
let path = ''
|
||
if (this.type != 2) {
|
||
path = '/preserve/common/HandleResult?entry=BC'
|
||
} else {
|
||
path = '/preserve/bc/imageUpload?entry=BC'
|
||
}
|
||
this.$jump({
|
||
flag: 'h5',
|
||
extra: {
|
||
url: location.origin + `/#${path}`
|
||
},
|
||
routerInfo: path
|
||
})
|
||
} else {
|
||
this.$toast(res.resultMessage)
|
||
}
|
||
},
|
||
error => {
|
||
console.log(error)
|
||
}
|
||
)
|
||
},
|
||
//添加受益人
|
||
add() {
|
||
let beneRatio = 0
|
||
this.beneficiariesNew.forEach(item => {
|
||
beneRatio += parseFloat(item.bnfLot | 0)
|
||
})
|
||
if (beneRatio >= 100) {
|
||
return this.$toast('受益份额已满~')
|
||
}
|
||
this.policy.bnfDTOs = {
|
||
beneficiariesOld: this.beneficiariesOld,
|
||
beneficiariesNew: this.beneficiariesNew
|
||
}
|
||
this.checkIsDetail(this.riskList)
|
||
localStorage['preserve-policy'] = JSON.stringify(this.policy)
|
||
this.$jump({
|
||
flag: 'h5',
|
||
extra: {
|
||
url: location.origin + '/#/preserve/bc/BeneficiaryInfoAdd'
|
||
},
|
||
routerInfo: {
|
||
path: '/preserve/bc/BeneficiaryInfoAdd'
|
||
}
|
||
})
|
||
},
|
||
// 删除受益人
|
||
deleteBeneficiary(index) {
|
||
Dialog.confirm({
|
||
className: 'dialog-delete',
|
||
title: '提示',
|
||
message: '您确认要删除该受益人吗?',
|
||
cancelButtonColor: '#E9332E',
|
||
confirmButtonColor: '#FFFFFF'
|
||
})
|
||
.then(() => {
|
||
// 删除页面中的对应数据
|
||
this.beneficiariesNew.splice(index, 1)
|
||
this.policy.bnfDTOs = {
|
||
beneficiariesOld: this.beneficiariesOld,
|
||
beneficiariesNew: this.beneficiariesNew
|
||
}
|
||
localStorage['preserve-policy'] = JSON.stringify(this.policy)
|
||
})
|
||
.catch(() => {
|
||
return
|
||
})
|
||
},
|
||
// 编辑受益人
|
||
editBeneficiary(index) {
|
||
this.policy.bnfDTOs = {
|
||
beneficiariesOld: this.beneficiariesOld,
|
||
beneficiariesNew: this.beneficiariesNew
|
||
}
|
||
this.checkIsDetail(this.riskList)
|
||
localStorage['preserve-policy'] = JSON.stringify(this.policy)
|
||
let path = '/preserve/bc/BeneficiaryInfoAdd?edit=' + index
|
||
this.$jump({
|
||
flag: 'h5',
|
||
extra: {
|
||
url: location.origin + '/#' + path
|
||
},
|
||
routerInfo: {
|
||
path: path
|
||
}
|
||
})
|
||
},
|
||
/*判断是否需要填写手机号等详细信息
|
||
新增/编辑指定受益人页面——只有当趸交保费≥20万元或期交保费*总期数≥20万元时，联系电话、联系地址、职业类别才可显示*/
|
||
checkIsDetail(arr) {
|
||
//TODO
|
||
let isDetailFlag = '0' //是否需要填写手机号等详细信息 0-是 1-否
|
||
let totalPrem = 0
|
||
arr.forEach(v => {
|
||
totalPrem += Number(v.payEndYear) == 1000 ? Number(v.prem) : Number(v.payEndYear) * Number(v.prem)
|
||
})
|
||
isDetailFlag = totalPrem >= 200000 ? '0' : '1'
|
||
this.policy.isDetailFlag = isDetailFlag
|
||
this.policy.isDetailFlag = '0' //TEST测试专用
|
||
}
|
||
},
|
||
filters: {
|
||
idToText: filters.idToText
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.beneficiary-container {
|
||
.add-btn {
|
||
width: 80%;
|
||
margin: 20px auto;
|
||
border: 1px dashed #999;
|
||
}
|
||
.beneficiary-list {
|
||
margin-bottom: 65px;
|
||
}
|
||
.item {
|
||
background-color: #f5f5f5;
|
||
}
|
||
}
|
||
.dialog-container {
|
||
/deep/.van-dialog__confirm {
|
||
background-color: #e9332e !important;
|
||
}
|
||
/deep/.van-dialog__header {
|
||
color: #e9332e !important;
|
||
padding-bottom: 5px;
|
||
}
|
||
/deep/.van-dialog {
|
||
width: 77%;
|
||
}
|
||
}
|
||
</style>
|