ebiz-h5/src/components/ebiz/customer/formBlock.vue

<template>
  <div>
    <van-cell-group>
      <!-- 基本信息 -->
      <van-field
        :value="userInfo.idType | idToText('idType')"
        readonly
        label="证件类型"
        name="证件类型"
        right-icon="arrow"
        placeholder="请选择"
        @click="toSelect('2')"
      />
      <van-field
        v-model="userInfo.customerIdNumber"
        label="证件号码"
        name="证件号码"
        placeholder="请输入"
        maxlength="18"
        @blur="getRelatedData(userInfo.customerIdNumber)"
      ></van-field>
      <FieldDatePicter
        label="证件起始日期"
        name="证件起始日期"
        :value.sync="userInfo.certificateValidate"
        type="date"
        :flag="true"
        ref="certificateValidate"
        @confirm="onDateConfirm($event, '0')"
      ></FieldDatePicter>
      <FieldDatePicter
        label="证件截止日期"
        name="证件截止日期"
        :value.sync="userInfo.certiexpiredate"
        type="date"
        :flag="true"
        ref="certiexpiredate"
        @confirm="onDateConfirm($event, '1')"
      ></FieldDatePicter>
      <div class="border-bt relative fs14 p10 flex align-center">
        <van-checkbox v-model="userInfo.effectiveDateType" class="fr" :disabled="effectiveDateTypeAble" @change="isEnd">长期</van-checkbox>
      </div>
      <select-radio :radios="sexRadio" label="性别" :value.sync="userInfo.customerSex" :required="false"></select-radio>
      <van-field
        :value="userInfo.nativeplace | idToText('nativeplace')"
        readonly
        label="国家/地区"
        name="国家/地区"
        right-icon="arrow"
        placeholder="请选择"
        @click="toSelect('1')"
      />
      <van-field v-model="census" readonly label="户籍" name="户籍" right-icon="arrow" placeholder="请选择" @click="censusShow = true" />
      <FieldDatePicter
        label="出生日期"
        :value.sync="userInfo.birthday"
        type="date"
        :flag="true"
        @confirm="onDateConfirm($event, '2')"
        ref="birthday"
      ></FieldDatePicter>
      <van-field v-model="userInfo.email" label="电子邮箱" name="电子邮箱" v-validate="'email'" placeholder="请输入" clearable maxlength="50" />
      <van-field v-model="userInfo.stature" label="身高（cm）" name="身高" placeholder="请输入" clearable v-validate="'onlyNumber|stature'" maxlength="5" />
      <van-field v-model="userInfo.weight" label=" 体重（kg）" name="体重" placeholder="请输入" clearable v-validate="'onlyNumber|avoirdupois'" />
      <van-field
        :value="userInfo.customerType | idToText('customerType')"
        readonly
        label="客户类型"
        name="客户类型"
        right-icon="arrow"
        placeholder="请选择"
        @click="toSelect('7')"
      />
      <van-field
        :value="userInfo.customerSource | idToText('customerSource')"
        readonly
        label="客户来源"
        name="客户来源"
        right-icon="arrow"
        placeholder="请选择"
        @click="toSelect('8')"
      />
    </van-cell-group>

    <!-- 工作信息 -->
    <van-cell-group>
      <p class="title pl10 pv12 mt10">工作信息</p>
      <van-field
        :value="userInfo.degree | idToText('degree')"
        readonly
        label="文化程度"
        name="文化程度"
        right-icon="arrow"
        placeholder="请选择"
        @click="toSelect('3')"
      />
      <select-radio :radios="medicalRadio" label="有无社保" :value.sync="userInfo.socialSecurity" :required="false"></select-radio>
      <van-field
        :value="userInfo.taxIdentity | idToText('taxIdentity')"
        readonly
        label="税收居民身份"
        name="税收居民身份"
        right-icon="arrow"
        placeholder="请选择"
        @click="toSelect('5')"
      />
      <occupation-picker
        :value.sync="userInfo.occupationCode"
        :chooseName.sync="userInfo.occupationName"
        :lifeGrade.sync="userInfo.lifeGrade"
        :healthGrade.sync="userInfo.healthGrade"
        clearable
        label="职业类别"
        name="职业类别"
        placeholder="请选择"
        :parentShowPicker.sync="occupationShowPicker"
        @on-click="selectClick"
        @on-choose="chooseOccupation"
      />
      <van-field
        v-model="userInfo.averageYearlyIncome"
        type="number"
        label="平均年收入（万元）"
        name="平均年收入"
        v-validate="'onlyInteger'"
        placeholder="请输入"
        clearable
        maxlength="5"
      />
      <van-field
        v-model="userInfo.liabilitiesMoney"
        type="number"
        label="负债金额（万元）"
        name="负债金额"
        v-validate="'onlyInteger'"
        placeholder="请输入"
        clearable
        maxlength="5"
      />
      <van-field v-model="userInfo.workUnits" label="工作单位" placeholder="请输入工作单位" clearable maxlength="50" />
      <van-field
        :value="userInfo.workCondition | idToText('workCondition')"
        readonly
        label="在职情况"
        name="在职情况"
        right-icon="arrow"
        placeholder="请选择"
        @click="toSelect('9')"
      />
      <van-field v-model="areaName" readonly label="单位地址" name="单位地址" right-icon="arrow" placeholder="请选择" @click="areaShow = true" />
      <van-field v-model="userInfo.companyAddress" label name="详细地址" placeholder="请输入详细地址" maxlength="30" />
      <van-field v-model="userInfo.companyZip" type="number" label="邮编" placeholder="请输入" clearable maxlength="6" v-validate="'zipCode'" />
      <van-field v-model="userInfo.companyPhone" label="单位电话" name="单位电话" placeholder="请输入" clearable maxlength="13" />
    </van-cell-group>

    <!-- 家庭信息 -->
    <van-cell-group class="mt5">
      <p class="title pl10 pv12 mt10">家庭信息</p>
      <van-field
        :value="userInfo.marriage | idToText('marriage')"
        readonly
        label="婚姻状况"
        name="婚姻状况"
        right-icon="arrow"
        placeholder="请选择"
        @click="toSelect('6')"
      />
      <van-field
        v-model="userInfo.familyAnnualIncome"
        type="number"
        label="家庭年收入（万元）"
        name="家庭年收入"
        v-validate="'onlyInteger'"
        placeholder="请输入"
        clearable
      />
      <van-field v-model="homeName" readonly label="家庭地址" name="家庭地址" right-icon="arrow" placeholder="请选择" @click="homeShow = true" />
      <van-field v-model="userInfo.homeAddress" label name="详细地址" placeholder="请输入详细地址" />
      <van-field v-model="userInfo.homeZip" type="number" label="邮编" placeholder="请输入" clearable maxlength="6" v-validate="'zipCode'" />
      <van-field v-model="userInfo.homePhone" label="家庭电话" name="家庭电话" placeholder="请输入" clearable maxlength="13" />
    </van-cell-group>

    <!-- 字段选择 -->
    <van-popup v-model="popupShow" position="bottom">
      <van-picker show-toolbar :columns="columns" @confirm="onConfirm" @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="areaLists" :value="areaValue" @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="areaShow = false" />
    </van-popup>
  </div>
</template>

<script>
import { Field, CellGroup, Cell, Popup, Picker, Checkbox, Area } from 'vant'
import SelectRadio from '@/components/ebiz/SelectRadio'
import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
import DataDictionary from '@/assets/js/utils/data-dictionary'
import OccupationPicker from '@/components/ebiz/occipation/OccupationPicker'
import areaList from '@/assets/js/utils/areaForSale'
import areaLists from '@/assets/js/utils/areaNewForSale'
import utilsAge from '@/assets/js/utils/age'
import getAreaName, { getCensusName } from '@/assets/js/utils/getAreaNameForSale'
import idNoCheck from '@/assets/js/utils/idNoCheck'
import { idToData } from '@/views/ebiz/customer/js/verification'
import filter from '@/filters/index'
import riskRules from '@/views/ebiz/common/risk-rules'

export default {
  name: 'formBlock',
  components: {
    [Field.name]: Field,
    [CellGroup.name]: CellGroup,
    [Cell.name]: Cell,
    [Popup.name]: Popup,
    [Picker.name]: Picker,
    [Checkbox.name]: Checkbox,
    [FieldDatePicter.name]: FieldDatePicter,
    [OccupationPicker.name]: OccupationPicker,
    [SelectRadio.name]: SelectRadio,
    [Area.name]: Area
  },
  props: ['userInfo'],
  data() {
    return {
      popupShow: false,
      areaShow: false, //省级联动
      homeShow: false,
      censusShow: false, //户籍联动
      census: '',
      pickerType: undefined,
      columns: [],
      valueKey: 'text',
      nativeplace: '',
      idType: '',
      degree: '',
      socialSecurity: '',
      taxIdentity: '',
      areaName: '', //单位地址
      homeName: '', //家庭地址
      marriage: '',
      areaList: areaList,
      areaLists: areaLists,
      customerType: '',
      customerSource: '',
      age: '',
      effectiveDateTypeAble: false, //长期按钮是否禁用
      occupationShowPicker: false,
      sexRadio: [
        {
          label: '男',
          value: '0'
        },
        {
          label: '女',
          value: '1'
        }
      ],
      medicalRadio: [
        {
          label: '有',
          value: '0'
        },
        {
          label: '无',
          value: '1'
        }
      ],
      manageComCode:'',//代理人管理机构 52贵州 45广西
      areaValue:'' //代理人管理机构--省级编号
    }
  },
  watch: {
    userInfo: {
      handler(newVal, oldVal) {
        // console.log("老数据",oldVal);
        //  console.log("新数据",newVal);
        // if(newVal.toString() != oldVal.toString()){
        this.userInfo = newVal
        if (this.userInfo.province) {
          this.censusInfo()
        }
        if (this.userInfo.companyProvince) {
          this.areaNameInfo()
        }
        if (this.userInfo.homeProvince) {
          this.homeNameInfo()
        }
        if (this.userInfo.certiexpiredate == '9999-12-31') {
          this.userInfo.effectiveDateType = true
        }
      },
      deep: true
    }
  },
  filters: {
    idToText: filter.idToText
  },
  async mounted() {
    //获取代理人管理机构 52贵州 45广西
    let dataReturn = await riskRules.getAgentInfoFunc(this)
    this.manageComCode = dataReturn.manageComCode
    if(this.manageComCode == '45'){
      areaLists.province_list = {
        450000: '广西壮族自治区'
      }
      this.areaValue = '450000'
    }else{
      areaLists.province_list = {
        520000: '贵州省'
      }
      this.areaValue = '520000'
    }
    this.areaLists = areaLists
  },
  methods: {
    selectClick() {
      let title = ''
      ;[this.occupationShowPicker, title] = [true, '职业类别']
    },
    chooseOccupation() {
      this.occupationShowPicker = false
    },
    // 表单校验
    validateForm() {
      return this.$validator.validateAll()
    },
    //证件类型校验
    validateIdType() {
      // 计算年龄
      let age = utilsAge.getAge(this.userInfo.birthday, new Date())
      //证件是身份证
      if (this.userInfo.idType == '1') {
        console.log('证件类型是身份证')
        if (this.userInfo.customerIdNumber.length == '15') {
          //15位身份证第15位是性别位, 奇男偶女
          let sexSign = this.userInfo.customerIdNumber.substr(14, 1)
          if ((parseInt(sexSign) % 2 == 0 && this.userInfo.customerSex != 1) || (parseInt(sexSign) % 2 != 0 && this.userInfo.customerSex != 0)) {
            return this.$toast('性别录入与身份证不符')
          }
          //15位身份证第7-12位是生日位, 年月日
          let birthSign = this.userInfo.customerIdNumber.substr(6, 6)
          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.customerIdNumber.length == '18') {
          //18位身份证第17位是性别位, 奇男偶女
          let sexSign = this.userInfo.customerIdNumber.substr(16, 1)
          if ((parseInt(sexSign) % 2 == 0 && this.userInfo.customerSex != 1) || (parseInt(sexSign) % 2 != 0 && this.userInfo.customerSex != 0)) {
            return this.$toast('性别录入与身份证不符')
          }
          //18位身份证第7-14位是生日位, 年月日
          let birthSign = this.userInfo.customerIdNumber.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.customerIdNumber)) {
          return this.$toast('您填写的证件号码有误')
        }
        //年龄在0-15周岁之间
        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 = ''
            return this.$toast('证件有效期不正常，未满16周岁的公民身份证有效期应小于等于5年')
          } else {
            this.checkMarr()
          }
          //年龄在 16-25 周岁之间
        } else 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 = ''
            return this.$toast('证件有效期不正常，16周岁至25周岁公民身份证有效期应小于等于10年')
          } else {
            this.checkMarr()
          }
          //年龄在 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 = ''
            return this.$toast('证件有效期不正常，26周岁至45周岁公民身份证有效期应小于等于20年')
          } else {
            this.$parent.updateCustomerInfo()
          }
        } else {
          this.$parent.updateCustomerInfo()
        }
        //证件是户口本
      } else if (this.userInfo.idType == '2') {
         if (this.userInfo.nativeplace != '1') {
            return this.$toast('证件类型”为“身份证，国籍必须为中国哦')
          }
          //校验性别是否与身份证号码位相符
          if (this.userInfo.idNo.length == '15') {
            //15位身份证第15位是性别位, 奇男偶女
            let sexSign = this.userInfo.idNo.substr(14, 1)
            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)
            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 > 16) {
          return this.$toast('客户年龄在16周岁以上，不能使用户口本作为有效证件')
        }
        // else if (this.userInfo.customerIdNumber.length != 18) {
        //   return this.$toast('户口本的证件号码长度应等于18位')
        // }
        else {
          this.checkMarr()
        }
        //证件是出生证明
      } else if (this.userInfo.idType == '3') {
        if (age >= 2) {
          return this.$toast('客户年龄在2周岁及以上，不能使用出生证作为有效证件')
        }
        // 证件号码规则校验
        if (!idNoCheck.isCardNoBirth(this.userInfo.idNo)) {
          console.log('证件号码校验有误')
          return this.$toast('您填写的证件号码有误')
        }
        // else if (this.userInfo.customerIdNumber.length < 3) {
        //   return this.$toast('出生证须大于等于3个字符')
        // }
        else {
          this.checkMarr()
        }
        //证件是护照
      }
      // else if (this.userInfo.idType == '4' && this.userInfo.customerIdNumber.length < 3) {
      //   console.log('证件类型是护照')
      //   return this.$toast('护照须大于等于3个字符')
      //   //证件是港澳居民通行证
      // } else if (this.userInfo.idType == '5') {
      //   console.log('证件类型是港澳居民通行证')
      //   if (this.userInfo.customerIdNumber.length != 9) {
      //     return this.$toast('证件类型为港澳居民通行证的，证件号码须为9位')
      //   } else if (!/^(H|M)[0-9]{8}$/.test(this.userInfo.customerIdNumber)) {
      //     return this.$toast('证件类型为港澳居民通行证的，证件号码首位字母为"H"/"M",证件号码第2位至第9位为阿拉伯数字')
      //   } else {
      //     this.checkMarr()
      //   }
      //   //证件是台湾居民通行证
      // } else if (this.userInfo.idType == '6' && this.userInfo.customerIdNumber.length != 8) {
      //   console.log('证件类型是台湾居民通行证')
      //   return this.$toast('证件类型为台湾居民通行证的，证件号码须为8位数字')
      // }
      else {
        this.checkMarr()
      }
    },
    //婚否校验
    validateMarr() {
      let age = utilsAge.getAge(this.userInfo.birthday, new Date())
      if ((this.userInfo.customerSex == '0' && age < 22) || (this.userInfo.customerSex == '1' && age < 20)) {
        if (this.userInfo.marriage != '2') {
          return this.$toast('年龄与婚姻状况不符')
        } else {
          this.$parent.updateCustomerInfo()
        }
      } else {
        this.$parent.updateCustomerInfo()
      }
    },
    checkMarr() {
      if (this.userInfo.birthday && this.userInfo.marriage) {
        this.validateMarr()
      } else {
        this.$parent.updateCustomerInfo()
      }
    },
    censusInfo() {
      let area = [{ code: this.userInfo.province }, { code: this.userInfo.city }]
      this.census = getCensusName(area)
    },
    areaNameInfo() {
      let area = [{ code: this.userInfo.companyProvince }, { code: this.userInfo.companyCity }, { code: this.userInfo.companyArea }]
      this.areaName = getAreaName(area)
    },
    homeNameInfo() {
      let area = [{ code: this.userInfo.homeProvince }, { code: this.userInfo.homeCity }, { code: this.userInfo.homeArea }]
      this.homeName = getAreaName(area)
    },
    //弹框选择
    toSelect(pickerType, valueKey) {
      //pickerType 1、国家地区 2、证件类型 3、文化程度 4、有无社保 5、税收居民身份 6、婚姻状况
      ;[this.popupShow, this.pickerType] = [true, pickerType]
      if (valueKey) this.valueKey = valueKey
      if (pickerType == '1') {
        this.columns = DataDictionary.nativeplace
      } else if (pickerType == '2') {
        this.columns = DataDictionary.idType
        // if (this.userInfo.birthday) {
        //   let age = utilsAge.getAge(this.userInfo.birthday, new Date())
        //   if (age >= 3 && age < 16) {
        //     this.columns = DataDictionary.birthType
        //   } else if (age >= 3 && age >= 16) {
        //     this.columns = DataDictionary.insuredIdType
        //   } else {
        //     this.columns = DataDictionary.idType
        //   }
        // } else {
        //   this.columns = DataDictionary.idType
        // }
      } else if (pickerType == '3') {
        this.columns = DataDictionary.degree
        // } else if (pickerType == '4') {
        //   this.columns = DataDictionary.socialSecurity
      } else if (pickerType == '5') {
        this.columns = DataDictionary.taxIdentity
      } else if (pickerType == '6') {
        this.columns = DataDictionary.marriage
      } else if (pickerType == '7') {
        this.columns = DataDictionary.customerType
      } else if (pickerType == '8') {
        this.columns = DataDictionary.customerSource
      } else if (pickerType == '9') {
        this.columns = DataDictionary.workCondition
      }
    },
    //确认选择字段
    onConfirm(value) {
      this.popupShow = false
      if (this.pickerType == '1') {
        ;[this.userInfo.nativeplace, this.nativeplace] = [value.id, value.text]
        this.valueKey = value.text
      } else if (this.pickerType == '2') {
        ;[this.userInfo.idType, this.idType] = [value.id, value.text]
        this.userInfo.customerIdNumber = this.userInfo.certificateValidate = this.userInfo.certiexpiredate = this.userInfo.birthday = ''
        this.userInfo.sex = '0'
        this.effectiveDateTypeAble = false
        //身份证,出生证明,护照以外的证件类型可以使用长期
        if (value.id == '1') {
          let age = utilsAge.getAge(this.userInfo.birthday, new Date())
          this.effectiveDateTypeAble = age <= 45
        } else if (value.id == '2' || value.id == '3') {
          this.effectiveDateTypeAble = true
        } else {
          this.effectiveDateTypeAble = false
        }
      } else if (this.pickerType == '3') {
        ;[this.userInfo.degree, this.degree] = [value.id, value.text]
        // } else if (this.pickerType == '4') {
        //   ;[this.userInfo.socialSecurity, this.socialSecurity] = [value.id, value.text]
      } else if (this.pickerType == '5') {
        ;[this.userInfo.taxIdentity, this.taxIdentity] = [value.id, value.text]
      } else if (this.pickerType == '6') {
        ;[this.userInfo.marriage, this.marriage] = [value.id, value.text]
      } else if (this.pickerType == '7') {
        ;[this.userInfo.customerType, this.customerType] = [value.id, value.text]
      } else if (this.pickerType == '8') {
        ;[this.userInfo.customerSource, this.customerSource] = [value.id, value.text]
      } else if (this.pickerType == '9') {
        ;[this.userInfo.workCondition, this.workCondition] = [value.id, value.text]
      }
    },
    //区域选择
    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': //家庭地址
          this.homeName = getAreaName(area, 'new')
          ;[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 = getCensusName(area)
          ;[this.userInfo.province, this.userInfo.city] = [area[0].code, area[1].code]
          this.censusShow = false
          break
      }
    },
    //证件起始截止日期
    onDateConfirm(val, 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('证件起始日期填写错误')
            }
            // 计算年龄
            let age = utilsAge.getAge(this.userInfo.birthday, new Date())
            // 长期按钮是否禁用
            this.effectiveDateTypeAble = age <= 45
          }
          break
        case '1':
          {
            //证件截止日期
            //如果已经勾选了长期
            // 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('您的证件已过期')
            }
          }
          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
            }
            //出生证有效期
            if (this.userInfo.idType == '3') {
              if (Date.parse(this.userInfo.certiexpiredate) - Date.parse(val) > Date.parse('1973-01-01')) {
                this.userInfo.birthday = ''
                this.$refs.birthday.date = ''
                return this.$toast('出生证有效期或出生日期有误')
              }
            }
          }
          break
      }
    },
    //长期状态改变时
    isEnd(val) {
      //勾选长期状态时,证件截止日期置空
      if (val) {
        this.userInfo.certiexpiredate = ''
        this.certiexpiredateRequired = false
        sessionStorage.setItem('isEnd', '9999-12-31')
      } else {
        this.certiexpiredateRequired = true
        sessionStorage.setItem('isEnd', '')
      }
    },
    isEndFlag() {
      let idType = sessionStorage.getItem('idType')
      let birthday = sessionStorage.getItem('birthday')
      let age = utilsAge.getAge(birthday, new Date())
      if (idType == '1') {
        this.effectiveDateTypeAble = age <= 45
      } else if (idType == '2' || idType == '3') {
        this.effectiveDateTypeAble = true
      }
    },
    getRelatedData(val) {
      //客户列表新增时，身份证和户口本证件号校验规则一致
      if (this.userInfo.idType != '1' && this.userInfo.idType != '2' ) {
        return
      }
      //如果证件校验不通过,恢复默认值
      if (idToData(val).text) {
        ;[this.userInfo.customerSex, this.userInfo.birthday, this.effectiveDateTypeAble] = ['0', '', false]
        return this.$toast(idToData(val).text)
      }
      this.userInfo.effectiveDateType = false
      this.effectiveDateTypeAble = idToData(val).age <= 45
      this.userInfo.birthday = idToData(val).birthday
      this.userInfo.customerSex = idToData(val).sex
    }
  }
}
</script>
<style lang="scss" scoped>
.title {
  font-size: 15px;
  font-weight: bold;
  border-bottom: 1px solid #ebedf0;
}
[class*='van-hairline']::after {
  border: none !important;
}
.van-checkbox {
  margin-left: auto;
}
</style>