From 08d57e922cdc4c557658ef4def0fbd1f308be959 Mon Sep 17 00:00:00 2001
From: zhangqi1 <zhang.qi1@ebiz-digits.com>
Date: Wed, 8 Sep 2021 18:36:58 +0800
Subject: [PATCH] =?UTF-8?q?GFRS-2618=E3=80=90=E5=89=8D=E7=AB=AF=E3=80=91?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=B4=A5=E8=B4=B4=E7=94=B3=E8=AF=B7=E7=9A=84?=
 =?UTF-8?q?=E5=9F=BA=E6=9C=AC=E4=BF=A1=E6=81=AF=E9=A1=B5=E9=9D=A2=E7=9A=84?=
 =?UTF-8?q?=E9=83=A8=E5=88=86=E4=BB=A3=E7=A0=81=E3=80=82=E6=8F=90=E4=BA=A4?=
 =?UTF-8?q?=E4=BA=BA--=E5=BC=A0=E9=BD=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/js/utils/data-dictionary.js        |  20 +-
 .../ebiz/allowance/application/IndexBar.vue   | 226 ++++++
 .../ebiz/allowance/application/BaseInfo.vue   | 642 ++++++++++++++++++
 3 files changed, 887 insertions(+), 1 deletion(-)
 create mode 100644 src/components/ebiz/allowance/application/IndexBar.vue

diff --git a/src/assets/js/utils/data-dictionary.js b/src/assets/js/utils/data-dictionary.js
index 822103fad..08745054c 100644
--- a/src/assets/js/utils/data-dictionary.js
+++ b/src/assets/js/utils/data-dictionary.js
@@ -3614,6 +3614,24 @@ export default {
   queryOccupationalByType: [
     { id: '1', text: '卡单' },
     { id: '2', text: '重新投保' }
-  ]
+  ],
 
+  // 津贴申请-证件类型的枚举（父母津贴申请功能专用，因为父母津贴功能中证件类型没有出生证，所以在此创建一个新的枚举，供父母津贴功能专用）
+  allowanceIdType: [
+    { id: 1, text: '居民身份证' },
+    { id: 2, text: '户口本' },
+    // { id: 3, text: '出生证' },
+    { id: 4, text: '护照' },
+    { id: 5, text: '港澳居民来往内地通行证' },
+    { id: 6, text: '台湾居民来往大陆通行证' },
+    // { id: 7, text: '其他', disabled: true },
+    { id: 8, text: '外国人永久居留身份证' },
+    { id: 9, text: '港澳台居民居住证' }
+  ],
+
+  // 津贴申请-享受人角色的枚举（父母津贴申请功能专用）
+  allowanceEnjoyUserRole: [
+    { id: '0', text: '父亲' },
+    { id: '1', text: '母亲' }
+  ]
 }
diff --git a/src/components/ebiz/allowance/application/IndexBar.vue b/src/components/ebiz/allowance/application/IndexBar.vue
new file mode 100644
index 000000000..ddae31ca5
--- /dev/null
+++ b/src/components/ebiz/allowance/application/IndexBar.vue
@@ -0,0 +1,226 @@
+<template>
+  <div class='own_content'>
+    <ul class='index-bar'>
+      <li @click='changePage(Number(index) + 1)' v-for='(item, index) in pageTitle' :key='index' :class='item.tabClass'
+          :id='item.tabClass'>
+        <!-- 选中 -->
+        <div v-if='item.tabClass' class='flex justify-content-fs align-items-c'>
+          <div class='flex flex-direction-colunm align-items-c'>
+            <van-image :src='item.imgCheckedUrl' class='image_head' />
+            <span class='fs12 mt12'>{{ item.pageItem }}</span>
+          </div>
+          <van-image :src='doneUrl' v-if='index !== 7' class='image_done' />
+        </div>
+        <div v-if='!item.tabClass' class='flex justify-content-fs align-items-c'>
+          <div class='flex flex-direction-colunm align-items-c'>
+            <van-image :src='item.imgNoCheckedUrl' class='image_head' />
+            <span class='fs12 mt12' style='color: #999999'>{{ item.pageItem }}</span>
+          </div>
+          <van-image :src='doneNurl' v-if='index !== 7' class='image_done' />
+        </div>
+      </li>
+    </ul>
+  </div>
+</template>
+<script>
+import { Icon, Image as VanImage } from 'vant'
+
+export default {
+  name: 'IndexBar',
+  props: {
+    value: {
+      type: String,
+      default: ''
+    },
+    required: {
+      type: Boolean,
+      default: false
+    },
+    data: {
+      type: Array,
+      default: () => {
+      }
+    },
+    //选项对象中，文字对应的 key
+    valueKey: {
+      type: String,
+      default: 'text'
+    }
+  },
+  components: {
+    [Icon.name]: Icon,
+    [VanImage.name]: VanImage
+  },
+  data() {
+    return {
+      doneUrl: this.$assetsUrl + 'images/kmh/done.png',
+      doneNurl: this.$assetsUrl + 'images/kmh/done_n.png',
+      pageTitle: [
+        {
+          pageNo: 1,
+          pageItem: '基本信息',
+          urlStr: '/allowance/application/BaseInfo',
+          tabClass: '',
+          imgCheckedUrl: this.$assetsUrl + 'images/kmh/tbrxx.png',
+          imgNoCheckedUrl: this.$assetsUrl + 'images/kmh/tbrxx_n.png'
+        },
+        {
+          pageNo: 2,
+          pageItem: '账户信息',
+          urlStr: '/allowance/application/AccountInfo',
+          tabClass: '',
+          imgCheckedUrl: this.$assetsUrl + 'images/kmh/zhxx.png',
+          imgNoCheckedUrl: this.$assetsUrl + 'images/kmh/zhxx_n.png'
+        },
+        {
+          pageNo: 3,
+          pageItem: '影响资料',
+          urlStr: '/allowance/application/AttachmentManagement',
+          tabClass: '',
+          imgCheckedUrl: this.$assetsUrl + 'images/kmh/fjsc.png',
+          imgNoCheckedUrl: this.$assetsUrl + 'images/kmh/fjsc_n.png'
+        },
+        {
+          pageNo: 4,
+          pageItem: '签名确认',
+          urlStr: '/allowance/application/SignatureConfirmation',
+          tabClass: '',
+          imgCheckedUrl: this.$assetsUrl + 'images/kmh/qmqr.png',
+          imgNoCheckedUrl: this.$assetsUrl + 'images/kmh/qmqr_n.png'
+        }
+      ],
+      //localStorage.salePageFlag:控制导航是否可以直接跳转页面  1-投保人信息 2-被保人信息 3-选择产品 4-受益人信息 5-告知信息 6-账户信息 7-附件上传 8-签名确认
+      salePageFlag: Number(localStorage.salePageFlag)
+    }
+  },
+  mounted() {
+    this.selectTab()
+  },
+  methods: {
+    changePage(pageIndex) {
+      let url = ''
+      //由 localStorage.salePageFlag 来控制是否可跳到指定页面
+      if (localStorage.salePageFlag == '-10' && pageIndex != 8) {
+        this.$toast('已到达签名确认流程，不可以回到前面的流程')
+      }
+      if (Number(localStorage.salePageFlag) < Number(pageIndex)) return
+      switch (pageIndex) {
+        case 1: //跳到基本信息页面
+          url = `/allowance/application/BaseInfo?edit=1&salePageFlag=${pageIndex}`
+          break
+        case 2: //跳到账户信息页面
+          url = `/allowance/application/AccountInfo?edit=1&salePageFlag=${pageIndex}`
+          break
+        case 3: //跳到影像资料页面
+          url = `/allowance/application/AttachmentManagement?edit=1&salePageFlag=${pageIndex}`
+          break
+        case 4: //跳到签名确认页面
+          url = `/allowance/application/SignatureConfirmation?edit=1&salePageFlag=${pageIndex}`
+          break
+        default:
+          break
+      }
+      let str = location.hash
+      let i = str.search(/AttachmentManagement/i)
+      if (i !== -1 && pageIndex != 7 && pageIndex != 8) {
+        this.$dialog
+          .confirm({
+            className: 'dialog-delete',
+            title: '提示',
+            message: '离开此页可能会丢失部分数据，是否确认离开？',
+            cancelButtonColor: '#E9332E',
+            confirmButtonColor: '#FFFFFF'
+          })
+          .then(() => {
+            this.$jump({
+              flag: 'h5',
+              extra: {
+                forbidSwipeBack: '1',
+                url: location.origin + `/#${url}`
+              },
+              routerInfo: { path: url }
+            })
+          })
+          .catch(() => {
+            return
+          })
+      } else {
+        this.$jump({
+          flag: 'h5',
+          extra: {
+            forbidSwipeBack: '1',
+            url: location.origin + `/#${url}`
+          },
+          routerInfo: { path: url }
+        })
+      }
+    },
+    selectTab() {
+      let endIndex = location.hash.indexOf('?', 1)
+      let str = endIndex == -1 ? location.hash.slice(1) : location.hash.slice(1, endIndex)
+      this.pageTitle.forEach(v => {
+        if (v.urlStr.toLowerCase() == str.toLowerCase()) {
+          v.tabClass = 'active'
+        }
+      })
+      this.$nextTick(() => {
+        this.$el.querySelector('#active').scrollIntoView(true)
+      })
+    }
+  }
+}
+</script>
+<style lang='scss' scoped>
+.index-bar {
+  display: flex;
+  overflow-x: auto;
+  overflow-y: hidden;
+  white-space: nowrap;
+  font-size: 12px;
+}
+
+.index-bar li {
+  display: flex;
+  align-items: center;
+}
+
+.index-bar::-webkit-scrollbar {
+  display: none;
+}
+
+li {
+  display: flex;
+}
+
+.index-bar span,
+.index-bar van-icon {
+  align-items: center;
+}
+
+.active {
+  color: #e9332e;
+}
+
+.activeline {
+  background: #e9332e;
+}
+
+.image_head {
+  width: 16px;
+  height: 16px;
+}
+
+.image_done {
+  width: 8px;
+  height: 14px;
+  padding-left: 20px;
+  padding-right: 20px;
+}
+
+.own_content {
+  padding-top: 19px;
+  padding-bottom: 15px;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+</style>
diff --git a/src/views/ebiz/allowance/application/BaseInfo.vue b/src/views/ebiz/allowance/application/BaseInfo.vue
index e69de29bb..916d67ccb 100644
--- a/src/views/ebiz/allowance/application/BaseInfo.vue
+++ b/src/views/ebiz/allowance/application/BaseInfo.vue
@@ -0,0 +1,642 @@
+<template>
+  <div class='insured-info-container pb60 redRadioCheckbox'>
+    <!-- 基本信息 -->
+    <index-bar></index-bar>
+    <van-cell-group class='mt10'>
+      <van-field
+        v-model='applicantInfo.jobNumber'
+        v-validate="'required'"
+        readonly
+        required
+        label='申请人工号'
+        name='申请人工号'
+        placeholder='请填写申请人工号'
+      />
+      <van-field
+        v-model='applicantInfo.name'
+        v-validate="'required'"
+        readonly
+        required
+        label='申请人姓名'
+        name='申请人姓名'
+        placeholder='请填写申请人姓名'
+      />
+      <van-field
+        :value="applicantInfo.idType | idToText('allowanceIdType')"
+        v-validate="'required'"
+        readonly
+        required
+        label='申请人证件类型'
+        name='申请人证件类型'
+        right-icon='arrow'
+        placeholder='请选择'
+        @click='toSelect("1")'
+      />
+      <van-field
+        v-model='applicantInfo.idNo'
+        maxlength='18'
+        required
+        label='申请人证件号码'
+        name='申请人证件号码'
+        v-validate="'required'"
+        placeholder='手工录入或点击右侧证件扫描'
+        clearable
+      >
+        <van-button v-if='applicantInfo.idType == 1' slot='button' size='small' type='danger' round
+                    @click="selectClick('3')">证件扫描
+        </van-button>
+      </van-field>
+      <customer-picker
+        v-model='enjoyUserInfo.name'
+        @on-choose='chooseCustomer'
+        v-validate="'required|salename'"
+        name='享受人姓名'
+        label='享受人姓名'
+        required
+        :parentShowPicker.sync='customerShowPicker'
+        @nameChange='nameChange'
+        @on-click="selectClick('1')"
+      ></customer-picker>
+      <select-radio
+        :value.sync='enjoyUserInfo.role'
+        required
+        :radios='enjoyUserInfo.roleRadio'
+        label='享受人角色'
+        name='享受人角色'
+        v-validate="'required'"
+      ></select-radio>
+      <van-field
+        :value="enjoyUserInfo.idType | idToText('allowanceIdType')"
+        v-validate="'required'"
+        readonly
+        required
+        label='享受人证件类型'
+        name='享受人证件类型'
+        right-icon='arrow'
+        placeholder='请选择'
+        @click='toSelect("1")'
+      />
+      <van-field
+        v-model='enjoyUserInfo.idNo'
+        v-validate="'required'"
+        maxlength='18'
+        required
+        label='享受人证件号码'
+        name='享受人证件号码'
+        placeholder='手工录入或点击右侧证件扫描'
+        clearable
+        @blur='getRelatedData(enjoyUserInfo.idNo)'
+      >
+        <van-button v-if='enjoyUserInfo.idType == 1' slot='button' size='small' type='danger' round
+                    @click="selectClick('3')">证件扫描
+        </van-button>
+      </van-field>
+      <select-radio
+        :value.sync='enjoyUserInfo.sex'
+        required
+        :radios='enjoyUserInfo.sexRadio'
+        label='性别'
+        name='性别'
+        v-validate="'required'"
+      ></select-radio>
+      <FieldDatePicter
+        :value.sync='enjoyUserInfo.birthday'
+        v-validate="'required'"
+        label='出生日期'
+        name='出生日期'
+        required
+        type='date'
+        :flag='true'
+        @confirm='onDateConfirm($event)'
+        ref='birthday'
+      ></FieldDatePicter>
+
+
+    </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='isScan' position='bottom'>
+      <IdentityCardScan @getScanInfo='getIdentityInfo'></IdentityCardScan>
+    </van-popup>
+
+  </div>
+</template>
+<script>
+import IndexBar from '@/components/ebiz/allowance/application/IndexBar'
+import { Field, CellGroup, Checkbox, Popup, Picker, Area, RadioGroup, Radio, Dialog } from 'vant'
+import DataDictionary from '@/assets/js/utils/data-dictionary'
+import utilsAge from '@/assets/js/utils/age'
+import { selectComp, getIdentityInfo } from '../../sale/js/methods'
+import IdentityCardScan from '@/components/ebiz/sale/IdentityCardScan'
+import { idToData } from '../../sale/js/verification'
+import CustomerPicker from '@/components/ebiz/customer/CustomerPicker'
+import SelectRadio from '@/components/ebiz/SelectRadio'
+import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
+import beforeDate from '@/assets/js/utils/getBeforeDate.js'
+
+// import OccupationPicker from '@/components/ebiz/occipation/OccupationPicker'
+// import areaList from '@/assets/js/utils/areaForSale'
+// import areaLists from '@/assets/js/utils/areaNewForSale'
+// import { saveOrUpdateOrderInfo, getAuthCode, getOrderDetail, getCompany } from '@/api/ebiz/sale/sale'
+// import getAreaName from '@/assets/js/utils/getAreaNameForSale'
+// import idNoCheck from '@/assets/js/utils/idNoCheck'
+// import SearchField from '@/components/common/SearchField'
+
+export default {
+  name: 'insuredInfo',
+  components: {
+    [IndexBar.name]: IndexBar,
+    [Field.name]: Field,
+    [IdentityCardScan.name]: IdentityCardScan,
+    [CustomerPicker.name]: CustomerPicker,
+    [SelectRadio.name]: SelectRadio,
+    [FieldDatePicter.name]: FieldDatePicter
+    // [OccupationPicker.name]: OccupationPicker,
+    //
+    // [CellGroup.name]: CellGroup,
+    // [Checkbox.name]: Checkbox,
+    // [Popup.name]: Popup,
+    // [Picker.name]: Picker,
+    // [Area.name]: Area,
+    // [RadioGroup.name]: RadioGroup,
+    // [Radio.name]: Radio,
+
+
+    // [Dialog.name]: Dialog,
+    // SearchField
+  },
+  data() {
+    return {
+      // 定义存储申请人信息的对象
+      applicantInfo: {
+        jobNumber: '', // 申请人工号
+        name: '', // 申请人姓名
+        idType: '1', // 证件类型 (枚举值)
+        idNo: '' // 证件号码
+      },
+      // 定义存储享受人信息的对象
+      enjoyUserInfo: {
+        name: '', // 享受人姓名
+        role: '', // 享受人角色
+        // 享受人角色的选择项
+        roleRadio: [
+          { value: '0', label: '父亲' },
+          { value: '1', label: '母亲' }
+        ],
+        sex: '', // 享受人的性别
+        // 享受人性别的选择项
+        sexRadio: [
+          { value: '0', label: '男' },
+          { value: '1', label: '女' }
+        ],
+        idType: '1', // 证件类型 (枚举值)
+        idNo: '', // 证件号码
+        birthday: '',
+        maxDate: beforeDate.getBeforeYear(16)
+      },
+      pickerType: '', // 定义当选择证件类型时，为了区分填写的是申请人信息还是享受人信息的类型。1-申请人；2-享受人
+      popupShow: false, // 定义控制显示或隐藏popup弹出层的变量
+      columns: [], // 定义popup弹出层中的数据集合
+      currentPopupIndex: '',
+      customerShowPicker: false,
+      isScan: false //是否显示证件扫描组件
+    }
+  },
+  created() {
+
+  },
+  mounted() {
+    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
+  },
+  methods: {
+    /**
+     * @Description: 页面左上角关闭事件的回调方法
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    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 + `/#/sale/list`
+              },
+              routerInfo: {
+                path: `/sale/list`,
+                type: '1'
+              }
+            })
+          })
+          .catch(() => {
+            return
+          })
+      } else {
+        // 筛选按钮的点击事件
+        this.$jump({
+          flag: 'navigation',
+          extra: {
+            title: '津贴申请信息',
+            hiddenRight: '1'
+          }
+        })
+        if (this.currentPopupIndex == 1) {
+          this.customerShowPicker = false
+        } else if (this.currentPopupIndex == 3) {
+          this.isScan = false
+        }
+      }
+    },
+
+    /**
+     * @Description: 在popup弹出层中显示对应的数据
+     * @paramse: pickerType--区分填写的是申请人信息还是享受人信息的类型。1-申请人；2-享受人
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    toSelect(pickerType) {
+      // 显示弹出层
+      this.popupShow = true
+      // 将区分填写的是申请人信息还是享受人信息的类型的值，赋值给变量
+      // pickerType: 1-申请人；2-享受人
+      this.pickerType = pickerType
+      // 将数据字典中的'津贴申请-证件类型'数据集合赋值给变量
+      this.columns = DataDictionary.allowanceIdType
+    },
+
+    /**
+     * @Description: 点击popup弹出层中确认按钮触发的方法
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    onConfirm(value) {
+      this.popupShow = false
+      if (this.pickerType == '1') {
+        // 身份证号码不存在时赋默认值
+        if (!this.applicantInfo.idNo) {
+          this.applicantInfo.idNo = ''
+        }
+        this.applicantInfo.idType = value.id
+      } else if (this.pickerType == '2') {
+        // 身份证号码不存在时赋默认值
+        if (!this.userInfo.idNo) {
+          this.userInfo.idNo = ''
+        }
+        //若身份证件类型为身份证，自动带入性别
+        let sexSign = this.userInfo.idNo.length == 18 ? this.userInfo.idNo.substr(16, 1) : this.userInfo.idNo.length == 15 ? this.userInfo.idNo.substr(14, 1) : ''
+        //18位身份证第17位是性别位, 奇男偶女;15位身份证第15位是性别位, 奇男偶女
+        if (sexSign) {
+          if (parseInt(sexSign) % 2 == 0) {
+            this.userInfo.sex = '1'
+          } else {
+            this.userInfo.sex = '0'
+          }
+        }
+        this.userInfo.idType = value.id
+      }
+    },
+
+    /**
+     * @Description: 在享受人姓名位置，点击最右侧图标，选择享受人并获取对应享受人信息的方法
+     * @params: data--享受人的用户数据信息
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    chooseCustomer(data) {
+      console.log('data :>> ', data)
+      this.customerShowPicker = false
+      this.$jump({
+        flag: 'navigation',
+        extra: {
+          title: '津贴申请信息',
+          hiddenRight: '1'
+        }
+      })
+      // 将选择的享受人的数据，赋值给对应的变量
+      this.enjoyUserInfo.name = data.customerName // 享受人姓名
+      this.enjoyUserInfo.role = String(data.customerSex) // 享受人角色
+      this.enjoyUserInfo.idType = data.customerIdType //  享受人证件类型
+      this.enjoyUserInfo.idNo = data.customerIdNumber // 享受人证件号码
+      this.enjoyUserInfo.sex = String(data.customerSex) // 享受人性别
+      this.enjoyUserInfo.birthday = data.birthday // 享受人出生日期
+      this.getRelatedData(this.enjoyUserInfo.idNo)
+    },
+
+    /**
+     * @Description:
+     * @params:
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    getRelatedData(val) {
+      if (this.enjoyUserInfo.idType != '1') {
+        return
+      }
+      //如果证件校验不通过,恢复默认值
+      if (idToData(val).text) {
+        ;[this.enjoyUserInfo.idNo, this.enjoyUserInfo.sex] = ['', '0']
+        return this.$toast(idToData(val).text)
+      }
+      this.enjoyUserInfo.role = idToData(val).sex
+      this.enjoyUserInfo.sex = idToData(val).sex
+      this.enjoyUserInfo.birthday = idToData(val).birthday
+    },
+
+    /**
+     * @Description: 监听切换享受人姓名的方法
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    nameChange(name) {
+      this.enjoyUserInfo.name = name
+    },
+
+    /**
+     * @Description: 根据不同的参数类型，弹出不同的操作的页面
+     * @params: index-- 1: 选择用户列表的页面；2:选择职业类别的页面；3:扫描获取身份证信息的页面
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    selectClick(index) {
+      selectComp(this, index, '1')
+    },
+
+    /**
+     * @Description: 获取身份证扫描信息的方法
+     * @params: data--扫描获取到的用户信息
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    getIdentityInfo(data) {
+      getIdentityInfo(this, data, '1')
+    },
+
+    onDateConfirm(val) {
+      //出生日期
+      //如果录入日期晚于当前日期
+      if (Date.parse(val) > Date.parse(new Date())) {
+        this.enjoyUserInfo.birthday = ''
+        this.$refs.birthday.date = ''
+        return this.$toast('出生日期不晚于当日')
+      }
+    },
+
+    /**
+     * @Description: 点击下一步时触发的方法
+     * @author:zhangqi
+     * @Date:2021-09-08
+     */
+    async nextStep() {
+      //表单校验, 成功跳转
+      let valid = await this.$validator.validate()
+      // .then(valid => {
+      if (true === valid) {
+        localStorage.chooseProductCodesNew = localStorage.chooseProductCodes
+        // 计算年龄
+        let age = utilsAge.getAge(this.userInfo.birthday, new Date())
+        // 如果是未成年人
+        // if (age < 18) {
+        //   return this.$toast('投保人必须是具有民事行为能力且有固定职业和收入的自然人，请确定')
+        // }
+
+        //如果证件类型是身份证
+        if (this.userInfo.idType == '1') {
+          console.log('证件类型是身份证')
+
+          if (this.userInfo.nativeplace != '1') {
+            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 (!idNoCheck.isIdno(this.userInfo.idNo)) {
+            return this.$toast('您填写的证件号码有误')
+          }
+
+          //年龄在小于周岁（不含46周岁），证件有效期不能为长期
+          if (age < 46 && this.userInfo.effectiveDateType == true) {
+            return this.$toast('证件有效期错误，年龄小于46周岁，证件有效期不能为长期')
+          }
+          // 年龄在 16-25 周岁之间
+          if (age >= 16 && age <= 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) {
+            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年')
+            }
+          }
+          //证件类型是户口本
+        } else if (this.userInfo.idType == '2') {
+          if (age > 16) {
+            return this.$toast('客户年龄在16周岁以上，不能使用户口本作为有效证件')
+          }
+        } else if (this.userInfo.idType == '3') {
+          if (age >= 2) {
+            return this.$toast('客户年龄在2周岁及以上，不能使用出生证作为有效证件')
+          }
+        } else if (this.userInfo.idType == '4') {
+          if (this.userInfo.nativeplace == '1') {
+            return this.$toast('“证件类型”为“外国人护照”，“国籍”不能选择为“中国”哦~')
+          }
+        } else if (this.userInfo.idType == '5') {
+          console.log(this.userInfo.nativeplace, 'nativeplace')
+          if (this.userInfo.nativeplace != 2 && this.userInfo.nativeplace != 3) {
+            return this.$toast('“证件类型”为“港澳居民来往内地通行证”，“国籍”请选择“中国香港”或“中国澳门”哦~')
+          }
+        } else if (this.userInfo.idType == '6') {
+          if (this.userInfo.nativeplace != 4) {
+            return this.$toast('“证件类型”为“台湾居民来往大陆通行证”，“国籍”请选择“中国台湾”~')
+          }
+        } else if (this.userInfo.idType == '9') {
+          if (this.userInfo.nativeplace != 2 && this.userInfo.nativeplace != 3 && this.userInfo.nativeplace != 4) {
+            return this.$toast('“证件类型”为“港澳台居民居住证”，“国籍”请选择“中国香港”、“中国澳门”或“中国台湾”~')
+          }
+        }
+        // 投保人年龄必须大于等于16周岁哦
+        if (age < 16) {
+          return this.$toast('亲，投保人年龄必须大于等于16周岁哦~')
+        }
+
+        //职业类型不能为 '一般学生'
+        if (this.userInfo.occupationCode == '2099907') {
+          this.userInfo.occupationName = ''
+          return this.$toast('学生不可以作为投保人，请更换投保人投保')
+        }
+
+        if (!this.userInfo.workcompany) {
+          this.userInfo.workcompany = '无'
+        }
+
+        if (this.userInfo.salarySource == '4') {
+          if (!this.userInfo.otherSalarySource) {
+            return this.$toast('请输入其它收入来源')
+          }
+        }
+
+        // 婚姻状况处理: 使用computed/watch可能会出现检测不到的情况
+        for (let status of DataDictionary.marriage) {
+          if (status.text === this.userInfo.marriageStatus) {
+            this.userInfo.marriage = status.id
+          }
+        }
+
+        /*
+        //如果是已婚
+        if ((this.userInfo.sex == '0' && age < 22) || (this.userInfo.sex == '1' && age < 20)) {
+          if (this.userInfo.marriage != '2') {
+            return this.$toast('投保人不符合国家婚姻法定年龄')
+          }
+        }
+        */
+        // if (this.userInfo.marriage == '1') {
+        //   if (this.userInfo.sex == '0' && age < 22) {
+        //     return this.$toast('年龄与婚姻状况不符')
+        //   } else if (this.userInfo.sex == '1' && age < 20) {
+        //     return this.$toast('年龄与婚姻状况不符')
+        //   }
+        // }
+
+        // 通过国籍判断 证件是否符合要求
+        // 如果是国籍选择中国大陆
+
+        if (Number(this.userInfo.nativeplace) <= 4) {
+          // “身份证”或“台湾居民来往大陆通行证”或“港澳居民来往内地通行证”
+          let obj = {
+            1: true,
+            5: true,
+            6: true,
+            9: true
+          }
+          let idType = this.userInfo.idType
+          // 通过年龄 判断证件是否符合要求
+          // 小于2岁
+          if (age < 2) {
+            // “出生证”,"户口本"
+            obj['2'] = true
+            obj['3'] = true
+            if (obj[idType] === undefined) {
+              return this.$toast(
+                '亲，国籍为中国，且未满2周岁儿童，证件类型必须“身份证”或“户口本”或“出生证”或“台湾居民来往大陆通行证”或“港澳居民来往内地通行证”'
+              )
+            }
+          } else if (age < 16) {
+            // 小于16岁
+            // “户口本”
+            obj['2'] = true
+            if (obj[idType] === undefined) {
+              return this.$toast(
+                '亲，国籍为中国，且大于2周岁小于16周岁的未成年人，证件类型必须为“身份证”或“户口本”或“台湾居民来往大陆通行证”或“港澳居民来往内地通行证”'
+              )
+            }
+          } else {
+            // 大于16岁
+            if (obj[idType] === undefined) {
+              return this.$toast('亲，国籍为中国，证件类型必须为“身份证”或“台湾居民来往大陆通行证”或“港澳居民来往内地通行证”')
+            }
+          }
+        } else {
+          // 非大陆人员按外籍人员
+          let obj = {
+            4: true,
+            8: true
+          }
+          let idType = this.userInfo.idType
+          if (obj[idType] === undefined) {
+            return this.$toast('亲，国籍为外籍，证件类型必须为护照或外国人永久居留身份证投保')
+          }
+        }
+        if (this.isAsync) {
+          if (
+            !this.userWorkcompanys.some((item) => {
+              return item.asscompanies == this.userInfo.workcompany
+            })
+          ) {
+            if (
+              this.userWorkcompanys.some((item) => {
+                return item.asscompanies.search(this.userInfo.workcompany) != -1
+              })
+            ) {
+              return this.$toast('请填写完整的协同单位名称')
+            }
+            return this.$toast('您选择的为非协同单位，请重新选择。')
+          }
+        }
+        this.infoUpdate()
+        // console.log('success')
+      } else {
+        return this.$toast(this.$validator.errors.all()[0])
+      }
+      // })
+    }
+
+
+  },
+  computed: {},
+  watch: {}
+}
+</script>
+<style lang='scss' scoped>
+.insured-info-container {
+  /deep/ .van-checkbox {
+    margin-left: auto;
+  }
+
+  /deep/ .van-radio {
+    margin-left: auto;
+  }
+
+  /deep/ .van-field__label {
+    width: 30vw;
+  }
+}
+</style>