【new】新增保全进度详情：受益人相情感

2025-12-09 14:36:43 +08:00 · 2020-04-20 16:42:33 +08:00
parent be6e381513
commit 0b18daab3d
6 changed files with 569 additions and 114 deletions
--- a/src/router/ebiz/preserve.js
+++ b/src/router/ebiz/preserve.js
@@ -14,6 +14,8 @@ const surrenderInfo = () => import('@/views/ebiz/preserve/SurrenderInfo')
 const surrenderConfirmation = () => import('@/views/ebiz/preserve/SurrenderConfirmation')
 const Progress = () => import('@/views/ebiz/preserve/Progress')
 const Contact = () => import('@/views/ebiz/preserve/detail/Contact')
+const Beneficiary = () => import('@/views/ebiz/preserve/detail/Beneficiary')
+const BeneficiaryInfoD = () => import('@/views/ebiz/preserve/detail/BeneficiaryInfo')

 export default [
  {
@@ -151,4 +153,23 @@ export default [
      index: 15
    }
  },
+  {
+    path: '/preserve/detail/Beneficiary/:surrenderId',
+    name: 'Beneficiary',
+    component: Beneficiary,
+    meta: {
+      title: '受益人',
+      index: 16
+    }
+  },
+  {
+    path: '/preserve/detail/BeneficiaryInfo',
+    name: 'BeneficiaryInfoD',
+    component: BeneficiaryInfoD,
+    meta: {
+      title: '指定受益人信息',
+      index: 17
+    }
+  },
+  
 ]
--- a/src/views/ebiz/preserve/detail/Beneficiary.vue
+++ b/src/views/ebiz/preserve/detail/Beneficiary.vue
@@ -19,7 +19,7 @@
    <div class="fs14 beneficiary-list" v-if="type == 2">
      <ul>
        <li class="pv20 ph15 item" v-for="(item, index) in beneficiaries" :key="index">
-          <div class="bg-white p15" @click="detail(index)">
+          <div class="bg-white p15" @click="detail(item)">
            <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" />
@@ -38,7 +38,7 @@
        </li>
      </ul>
    </div>
-    <van-dialog
+    <!-- <van-dialog
      v-model="show"
      title="短信确认"
      show-cancel-button
@@ -56,9 +56,9 @@
          {{ codeDisabled ? `${countDown}s后重新获取` : '获取验证码' }}
        </van-button>
      </van-cell-group>
-    </van-dialog>
+    </van-dialog> -->

-    <van-button type="danger" class="bottom-btn" @click="nextStep">提交申请</van-button>
+    <!-- <van-button type="danger" class="bottom-btn" @click="nextStep">提交申请</van-button> -->
  </div>
 </template>

@@ -85,23 +85,23 @@ export default {
    }
  },
  data() {
-    let feachData = {
-      surrenderDTOList: [
-        {
-          surrenderId: '',
-          edorapplyNo: '',
-          surrenderType: '2',
-          bnfDTOs: []
-        }
-      ]
-    }
+    // let feachData = {
+    //   surrenderDTOList: [
+    //     {
+    //       surrenderId: '',
+    //       edorapplyNo: '',
+    //       surrenderType: '2',
+    //       bnfDTOs: []
+    //     }
+    //   ]
+    // }
    return {
-      show: false, // 获取短信验证码
-      codeDisabled: false, // 获取验证码按钮是否禁用
-      timeId: null, // 计时器ID
-      countDown: 60, // 倒计时
-      authCode: '', // 验证码
-      feachData: feachData,
+      // show: false, // 获取短信验证码
+      // codeDisabled: false, // 获取验证码按钮是否禁用
+      // timeId: null, // 计时器ID
+      // countDown: 60, // 倒计时
+      // authCode: '', // 验证码
+      // feachData: feachData,
      type: '',
      isDisType: true,
      policy: null,
@@ -110,16 +110,16 @@ export default {
    }
  },
  created() {
-    
    progressDetailQuery({
-      surrenderType : 1,
+      surrenderType : 2,
      surrenderId : this.$route.params.surrenderId
    })
    .then(res => {
-      console.log(res);
      if(res.result == '0'){
-        this.customerInfo = res.content.customerInfoDTOList[0]
-        this.surrenderResult = res.content.surrenderResult
+        this.policy = res.content.policyListDTOList[0]
+        this.insuredName = this.policy.insuredName
+        this.beneficiaries = res.content.bnfDTOs
+        this.type = this.beneficiaries[0].bnfType
      } else {
        this.$toast(res.resultMessage)
      }
@@ -127,7 +127,6 @@ export default {
    .catch( (err) => {
      console.log(err);
    })
-    
    // 获取保单列表存储的数据
    // this.policy = JSON.parse(localStorage['preserve-policy'])
    // this.insuredName = this.policy.insuredName
@@ -137,12 +136,13 @@ export default {
  mounted() {},
  methods: {
    //告知信息
-    nextStep() {
-      this.showAuth()
-    },
-    detail(index) {
+    // nextStep() {
+    //   this.showAuth()
+    // },
+    detail(item) {
      // edit=0
-      let path = '/preserve/BeneficiaryInfoDetail?edit=' + index
+      localStorage["preserve-userInfo"] = JSON.stringify(item)
+      let path = '/preserve/detail/BeneficiaryInfo'
      this.$jump({
        flag: 'h5',
        extra: {
@@ -154,90 +154,90 @@ export default {
      })
    },
    // 显示验证码  van-dialog
-    showAuth() {
-      this.show = true
-    },
-    // 获取短信验证码
-    getAuthCode() {
-      this.codeDisabled = true
-      //倒计时
-      this.timeId = setInterval(() => {
-        this.countDown--
-        if (this.countDown <= 0) {
-          window.clearInterval(this.timeId)
-          this.codeDisabled = false
-          this.countDown = 60
-        }
-      }, 1000)
+    // showAuth() {
+    //   this.show = true
+    // },
+    // // 获取短信验证码
+    // getAuthCode() {
+    //   this.codeDisabled = true
+    //   //倒计时
+    //   this.timeId = setInterval(() => {
+    //     this.countDown--
+    //     if (this.countDown <= 0) {
+    //       window.clearInterval(this.timeId)
+    //       this.codeDisabled = false
+    //       this.countDown = 60
+    //     }
+    //   }, 1000)

-      getAuthCode({
-        operateType: 'appntInfoEntry',
-        sessionId: '',
-        validateCode: '',
-        operateCode: this.customerMobile,
-        system: '',
-        operateCodeType: '0'
-      }).then(res => {
-        if (res.result == 0) {
-          this.sessionId = res.sessionId
-        } else {
-          this.$toast({
-            message: res.resultMessage,
-            onClose: this.showAuth
-          })
-        }
-      })
-    },
-    // 验证码确认事件
-    async authConfirm() {
-      //清理计时器
-      this.clearTimer()
-      this.changeSubmit()
-    },
-    // 清理计时器
-    clearTimer() {
-      window.clearInterval(this.timeId)
-      this.timeId = null
-      this.countDown = 60
-      this.codeDisabled = false
-    },
-    //提交变更申请
-    async changeSubmit() {
-      if (!this.sessionId) {
-        this.$toast({
-          message: '请先获取验证码',
-          onClose: this.showAuth
-        })
-        return
-      }
-      let res = await autchCodeCheck({
-        smsId: this.sessionId,
-        code: this.authCode
-      })
-      if (res.result == 0) {
-        this.$jump({
-          flag: 'h5',
-          extra: {
-            url: location.origin + `/#/preserve/submitResult`,
-            backToFirst: '1'
-          },
-          routerInfo: {
-            path: `/preserve/submitResult`
-          }
-        })
-      } else {
-        this.show = false
-        this.$toast({
-          message: res.resultMessage,
-          onClose: this.showAuth
-        })
-      }
-    }
+    //   getAuthCode({
+    //     operateType: 'appntInfoEntry',
+    //     sessionId: '',
+    //     validateCode: '',
+    //     operateCode: this.customerMobile,
+    //     system: '',
+    //     operateCodeType: '0'
+    //   }).then(res => {
+    //     if (res.result == 0) {
+    //       this.sessionId = res.sessionId
+    //     } else {
+    //       this.$toast({
+    //         message: res.resultMessage,
+    //         onClose: this.showAuth
+    //       })
+    //     }
+    //   })
+    // },
+    // // 验证码确认事件
+    // async authConfirm() {
+    //   //清理计时器
+    //   this.clearTimer()
+    //   this.changeSubmit()
+    // },
+    // // 清理计时器
+    // clearTimer() {
+    //   window.clearInterval(this.timeId)
+    //   this.timeId = null
+    //   this.countDown = 60
+    //   this.codeDisabled = false
+    // },
+    // //提交变更申请
+    // async changeSubmit() {
+    //   if (!this.sessionId) {
+    //     this.$toast({
+    //       message: '请先获取验证码',
+    //       onClose: this.showAuth
+    //     })
+    //     return
+    //   }
+    //   let res = await autchCodeCheck({
+    //     smsId: this.sessionId,
+    //     code: this.authCode
+    //   })
+    //   if (res.result == 0) {
+    //     this.$jump({
+    //       flag: 'h5',
+    //       extra: {
+    //         url: location.origin + `/#/preserve/submitResult`,
+    //         backToFirst: '1'
+    //       },
+    //       routerInfo: {
+    //         path: `/preserve/submitResult`
+    //       }
+    //     })
+    //   } else {
+    //     this.show = false
+    //     this.$toast({
+    //       message: res.resultMessage,
+    //       onClose: this.showAuth
+    //     })
+    //   }
+    // }
  },
-  beforeDestroy() {
-    //清理计时器
-    this.clearTimer()
-  }
+  // beforeDestroy() {
+  //   //清理计时器
+  //   this.clearTimer()
+  // }
 }
 </script>
 <style lang="scss" scoped>
--- a/src/views/ebiz/preserve/detail/BeneficiaryInfo.vue
+++ b/src/views/ebiz/preserve/detail/BeneficiaryInfo.vue
@@ -0,0 +1,286 @@
+<template>
+  <div class="add-beneficiary-container pb50">
+    <!-- 基本信息 -->
+    <van-cell-group>
+      <van-field
+        :value="userInfo.relationToInsured | idToText('relationToAppnt')"
+        required
+        readonly
+        label="是被保险人的"
+        name="是被保险人的"
+        right-icon="arrow"
+        placeholder="请选择"
+        v-validate="'required'"
+      />
+      <customer-picker
+        v-validate="'required|name'"
+        name="姓名"
+        label="姓名"
+        required
+        :value.sync="userInfo.name"
+        :parentShowPicker.sync="customerShowPicker"
+        readonly
+      ></customer-picker>
+      <van-field
+        :value="userInfo.idType | idToText('idType')"
+        v-validate="'required'"
+        readonly
+        required
+        label="证件类型"
+        name="证件类型"
+        right-icon="arrow"
+        placeholder="请选择"
+      />
+      <van-field
+        v-model="userInfo.idNo"
+        label="证件号码"
+        name="证件号码"
+        required
+        readonly
+        placeholder="请输入"
+        maxlength="18"
+        clearable
+        v-validate="'required'"
+      ></van-field>
+      <!-- <FieldDatePicter
+        :v-validate="{ required: effectiveDateRequired }"
+        label="证件起始日期"
+        name="证件起始日期"
+        :required="isRequired"
+        :defaultDate="new Date()"
+        :value.sync="userInfo.certificateValidate"
+        type="date"
+        @confirm="onDateConfirm($event, '1')"
+        ref="certificateValidate"
+        :flag="certificateValidateShow"
+        :readonly="idLimit"
+      ></FieldDatePicter> -->
+      <FieldDatePicter
+        :v-validate="{ required: effectiveDateRequired }"
+        label="证件截止日期"
+        name="证件截止日期"
+        :required="isRequired"
+        :defaultDate="new Date()"
+        :value.sync="userInfo.effectiveDate"
+        type="date"
+        @confirm="onDateConfirm($event, '1')"
+        ref="effectiveDate"
+        :flag="effectiveDateShow"
+        readonly
+      ></FieldDatePicter>
+      <div class="border-bt relative fs14 p10 flex align-center">
+        <van-checkbox v-model="userInfo.effectiveDateType" class="fr" :disabled="true">长期</van-checkbox>
+      </div>
+      <select-radio :radios="sexRadio" disabled required label="性别" :value.sync="userInfo.sex"></select-radio>
+      <van-field
+        :value="userInfo.nationality | idToText('nativeplace')"
+        readonly
+        label="国家/地区"
+        name="国家/地区"
+        required
+        v-validate="'required'"
+        right-icon="arrow"
+        placeholder="请选择"
+      />
+      <van-field
+        v-model="userInfo.bnfOrder"
+        required
+        readonly
+        label="受益顺序"
+        name="受益顺序"
+        placeholder="请输入"
+        v-validate="'required|onlyNumber'"
+        maxlength="1"
+      />
+      <van-field
+        v-model="userInfo.bnfLot"
+        label="受益比例(%)"
+        name="受益比例"
+        placeholder="请输入"
+        required
+        readonly
+        v-validate="'required|onlyNumber'"
+        maxlength="3"
+        clearable
+      />
+
+      <template v-if="false">
+        <van-field
+          v-model="userInfo.mobile"
+          clearable
+          label="联系电话"
+          name="联系电话"
+          required
+          readonly
+          placeholder="请输入"
+          v-validate="'required|mobile'"
+          maxlength="11"
+        />
+        <van-field
+          v-model="areaName"
+          readonly
+          label="联系地址"
+          name="联系地址"
+          required
+          right-icon="arrow"
+          placeholder="请选择"
+          v-validate="'required'"
+          @click="chooseArea"
+        />
+        <van-field v-model="userInfo.village" label="" readonly name="详细地址" placeholder="请输入详细地址" v-validate="'required'" clearable maxlength="30" />
+        <van-field v-model="userInfo.email" required readonly label="电子邮箱" name="电子邮箱" placeholder="请输入" v-validate="'required|email'" clearable />
+        <occupation-picker
+          :value.sync="userInfo.occupationCode"
+          :chooseName.sync="userInfo.occupationName"
+          :lifeGrade.sync="userInfo.lifeGrade"
+          :healthGrade.sync="userInfo.healthGrade"
+          clearable
+          label="职业类别"
+          name="职业类别"
+          required
+          v-validate="'required'"
+          placeholder="请选择"
+          readonly
+          :parentShowPicker.sync="occupationShowPicker"
+          @on-choose="chooseOccupation"
+        />
+      </template>
+    </van-cell-group>
+  </div>
+</template>
+
+<script>
+import { Field, CellGroup, Checkbox, Popup, Picker, Area } from 'vant'
+import SelectRadio from '@/components/ebiz/SelectRadio'
+import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
+import OccupationPicker from '@/components/ebiz/occipation/OccupationPicker'
+import DataDictionary from '@/assets/js/utils/data-dictionary'
+import areaList from '@/assets/js/utils/area'
+import getAreaName from '@/assets/js/utils/get-area-name'
+import utilsAge from '@/assets/js/utils/age'
+import IdentityCardScan from '@/components/ebiz/sale/IdentityCardScan'
+import CustomerPicker from '@/components/ebiz/customer/CustomerPicker'
+import idNoCheck from '@/assets/js/utils/idNoCheck'
+import { idToData } from '../js/verification'
+import { selectComp } from '../js/methods'
+let relationToInsured = DataDictionary.relationToAppnt
+
+export default {
+  name: 'beneficiaryInfoAdd',
+  components: {
+    [SelectRadio.name]: SelectRadio,
+    [FieldDatePicter.name]: FieldDatePicter,
+    [OccupationPicker.name]: OccupationPicker,
+    [Field.name]: Field,
+    [CellGroup.name]: CellGroup,
+    [Checkbox.name]: Checkbox,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    [Area.name]: Area,
+    [IdentityCardScan.name]: IdentityCardScan,
+    [CustomerPicker.name]: CustomerPicker
+  },
+  data() {
+    return {
+      effectiveDateTypeAble: true, //长期按钮是否禁用
+      isScan: false, //是否显示证件扫描组件
+      sexRadio: [
+        {
+          label: '男',
+          value: '0'
+        },
+        {
+          label: '女',
+          value: '1'
+        }
+      ],
+      currentPopupIndex: '',
+      relationToAppnt: '',
+      popupShow: false,
+      areaShow: false,
+      pickerType: undefined,
+      columns: [],
+      valueKey: 'text',
+      nationality: '',
+      idType: '居民身份证',
+      degree: '',
+      socialSecurity: '',
+      taxIdentity: '',
+      areaName: '',
+      areaValue: '110101',
+      effectiveDateRequired: true, //证件截止日期是否需要校验
+      effectiveDateShow: true, //证件截止日期是否可以选择
+      marriage: '',
+      isRequired: '', //长期前是否有*
+      userInfo: {
+        bnfId: '',
+        bnfType: '2',
+        bnfGrade: '',
+        name: '',
+        sex: '0',
+        nationality: '1',
+        birthday: '',
+        idType: '1',
+        idNo: '',
+        certificateValidate: '',
+        effectiveDate: '',
+        effectiveDateType: false, //是否长期
+        bnfNo: '1',
+        bnfOrder: 1,
+        bnfLot: '',
+        phone: '',
+        province: '',
+        city: '',
+        area: '',
+        postalAddress: '',
+        email: '',
+        occupationCode: '',
+        occupationName: '' // 职业中文
+      },
+      areaList: areaList,
+      occupationShowPicker: false,
+      customerShowPicker: false, //客户列表展示
+      idLimit: false, //证件起止日期是否只读
+      policy: null,
+      bnfDTOs: []
+    }
+  },
+  created() {
+    this.userInfo = JSON.parse(localStorage['preserve-userInfo'])
+  },
+  mounted() {},
+  methods: {
+    chooseOccupation() {
+      this.$jump({
+        flag: 'navigation',
+        extra: {
+          title: '指定受益人信息',
+          hiddenRight: '1'
+        }
+      })
+      this.occupationShowPicker = false
+    },
+    //时间戳格式处理
+    timeStampFormat(timeStamp) {
+      let date = new Date(timeStamp)
+      let year = date.getFullYear()
+      let month = date.getMonth() + 1
+      month = month.toString().padStart(2, '0')
+      let day = date.getDate()
+      day = day.toString().padStart(2, '0')
+      return `${year}-${month}-${day}`
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.add-beneficiary-container {
+  .title {
+    font-weight: 600;
+    border-bottom: 1px solid #dadada;
+  }
+  /deep/.van-checkbox {
+    margin-left: auto;
+  }
+}
+</style>
--- a/src/views/ebiz/preserve/js/data-dictionary.js
+++ b/src/views/ebiz/preserve/js/data-dictionary.js
@@ -31,6 +31,7 @@ export default {
    5: '退保保存的客户'
  },
  route: {
-    1: 'Contact'
+    1: 'Contact',
+    2: 'Beneficiary'
  }
 }
--- a/src/views/ebiz/preserve/js/methods.js
+++ b/src/views/ebiz/preserve/js/methods.js
@@ -0,0 +1,95 @@
+//点击弹出组件
+export function selectComp(that, index, type = '') {
+  that.currentPopupIndex = index
+  let title = ''
+  if (index == 1) {
+    ;[that.customerShowPicker, title] = [true, '客户列表']
+  } else if (index == 2) {
+    ;[that.occupationShowPicker, title] = [true, '职业类别']
+  } else if (index == 3) {
+    if (type == '1') {
+      //投保人
+      localStorage.scanFromInsured = 'true'
+    } else if (type == '2') {
+      //被保险人
+      localStorage.scanFromInsured = 'false'
+    }
+    ;[that.isScan, title] = [true, '身份证扫描']
+  }
+
+  setTimeout(() => {
+    that.$jump({
+      flag: 'navigation',
+      extra: {
+        title,
+        hiddenLeft: '1'
+      }
+    })
+    closeBtn(that)
+  }, 400)
+}
+
+// 关闭按钮的显示
+function closeBtn(that) {
+  that.$jump({
+    flag: 'webview_right_button',
+    extra: {
+      btns: [
+        {
+          img: that.$assetsUrl + 'images/del-close.png',
+          route: { flag: '', extra: {} }
+        }
+      ]
+    }
+  })
+}
+
+// 获取身份证扫描信息
+/**
+ *
+ * @param {*} that 上下文
+ * @param {*} data 扫描数据
+ * @param {*} type 1 投保人 2 被保险人
+ */
+export function getIdentityInfo(that, data, type) {
+  console.log(data)
+  // 正面
+  if (data.name && data.name != '待识别') {
+    that.userInfo.name = data.name
+    that.userInfo.idNo = data.idNo
+    that.userInfo.birthday = `${data.birthYear}-${data.birthMonth}-${data.birthDay}`
+    that.userInfo.sex = data.gender == '男' ? '0' : '1'
+  }
+  // 反面
+  if (data.startDate && data.startDate != '待识别') {
+    that.userInfo.certificateValidate = `${data.startDate.substr(0, 4)}-${data.startDate.substr(5, 2)}-${data.startDate.substr(8, 2)}`
+    //that.userInfo.certificateValidate = `${data.startDate.substr(0, 4)}-${data.startDate.substr(4, 2)}-${data.startDate.substr(6, 2)}`
+    // 是否为长期身份证
+    if (data.endDate != '长期') {
+      that.userInfo.certiexpiredate = `${data.endDate.substr(0, 4)}-${data.endDate.substr(5, 2)}-${data.endDate.substr(8, 2)}`
+      // that.userInfo.certiexpiredate = `${data.endDate.substr(0, 4)}-${data.endDate.substr(4, 2)}-${data.endDate.substr(6, 2)}`
+      that.effectiveDateTypeAble = true
+      that.idLimit = false
+      that.isRequired = true
+    } else {
+      // 勾选长期
+      that.userInfo.effectiveDateType = true
+      // 长期按钮不禁用
+      that.effectiveDateTypeAble = false
+      // 证件截止日期不需要校验
+      that.certiexpiredateRequired = false
+      //截止日期不可编辑
+      that.idLimit = true
+      that.isRequired = false
+    }
+  }
+  that.isScan = false
+  let title = type == '1' ? '投保人信息' : '被保险人信息'
+  that.$jump({
+    flag: 'navigation',
+    extra: {
+      title,
+      hiddenRight: '1'
+    }
+  })
+}
--- a/src/views/ebiz/preserve/js/verification.js
+++ b/src/views/ebiz/preserve/js/verification.js
@@ -0,0 +1,52 @@
+import changeFifteenToEighteen from '@/assets/js/utils/changeFifteenToEighteen'
+import idNoCheck from '@/assets/js/utils/idNoCheck'
+import utilsAge from '@/assets/js/utils/age'
+
+//身份证带出出生日期,性别,年龄
+export function idToData(idNo) {
+  //非空
+  if (!idNo.trim()) {
+    return {
+      text: '证件号码不能为空'
+    }
+  }
+
+  // 证件号码规则校验
+  if (!idNoCheck.isIdno(idNo)) {
+    return {
+      text: '您填写的证件号码有误'
+    }
+  }
+
+  //如果是15位身份证号先转为18位
+  if (idNo.length == 15) {
+    idNo = changeFifteenToEighteen(idNo)
+  }
+  let birthday = getBirthById(idNo)
+  let age = utilsAge.getAge(birthday, new Date())
+  let sex = getSexById(idNo)
+  return {
+    birthday,
+    age,
+    sex
+  }
+}
+
+function getBirthById(idNo) {
+  // 获取生日
+  var year = idNo.substr(6, 4)
+  var month = idNo.substr(10, 2)
+  var day = idNo.substr(12, 2)
+  return year + '-' + month + '-' + day
+}
+
+function getSexById(idNo) {
+  // 获取性别
+  if (idNo.charAt(16) >= '0' && idNo.charAt(16) <= '9') {
+    if (parseInt(idNo.charAt(16)) % 2 == 0) {
+      return '1'
+    } else {
+      return '0'
+    }
+  }
+}