feat: 投被信息录入信息变动方式同步

二者信息都是在内容补充完整之后进行校验， 校验完整之后开始同步

src/views/ebiz/saleFlowProImprove/InsuredInfo.vue

@@ -88,9 +88,12 @@
         :readonly="idLimit"
       ></FieldDatePicter>
       <div class="border-bt relative fs14 p10 flex align-center">
-        <van-checkbox v-model="userInfo.effectiveDateType" :disabled="effectiveDateTypeAble" @change="effectiveDataTypeChange">长期</van-checkbox>
+        <van-checkbox v-model="userInfo.effectiveDateType" :disabled="effectiveDateTypeAble"
+                      @change="effectiveDataTypeChange">长期
+        </van-checkbox>
       </div>
-      <select-radio required :radios="sexRadio" label="性别" name="性别" v-validate="'required'" :value.sync="userInfo.sex"></select-radio>
+      <select-radio required :radios="sexRadio" label="性别" name="性别" v-validate="'required'"
+                    :value.sync="userInfo.sex"></select-radio>
       <FieldDatePicter
         v-validate="'required'"
         label="出生日期"
@@ -145,7 +148,6 @@
         placeholder="请输入"
         v-validate="'required|mobileLength11|mobileStartWith1|mobile'"
         maxlength="11"
-        @blur="save"
       />
       <van-field
         v-model="userInfo.email"
@@ -155,7 +157,6 @@
         placeholder="请输入"
         v-validate="Number(branchType) !== 14 ? 'required|' : '' + 'email'"
         clearable
-        @blur="save"
       />
 
       <p class="email-tip" v-if="branchType == '14'">用于接收电子保单及相关服务通知</p>
@@ -185,7 +186,7 @@
         style="border-bottom: 1px solid #eee;display: flex;justify-content: space-between;align-items: center;"
         v-if="manageComCode == '45'"
       >
-        <van-radio-group @change="save" v-model="userInfo.isNewPeopleFlag" class="flex">
+        <van-radio-group v-model="userInfo.isNewPeopleFlag" class="flex">
           <label>
             <i class="red">*</i>
             新市民身份
@@ -241,7 +242,7 @@
       name="有无社保"
       required
       :value.sync="userInfo.medical"
-      @change="save"
+
     />
     <van-field
       :value="userInfo.taxResidentId | idToText('taxIdentity')"
@@ -301,7 +302,7 @@
       v-validate="'required|onlyNumber'"
       clearable
       maxlength="5"
-      @blur="save"
+
     />
     <!--      <van-field-->
     <!--        v-model="userInfo.liabilitiesMoney"-->
@@ -360,7 +361,6 @@
       v-validate="'required'"
       :value.sync="userInfo.isAsync"
       v-if="branchType != '14'"
-      @radioChange="save"
     />
     <SearchField
       :isAsync="userInfo.isAsync == 1"
@@ -391,7 +391,7 @@
       v-validate="'required|homeAddressNum|homeAddressCh'"
       clearable
       maxlength="30"
-      @blur="save"
+
       style="font-size: 3.5vw"
     />
     <!-- <van-field
@@ -466,21 +466,27 @@
       <!-- <van-field v-model="userInfo.homePhone" label="家庭电话" name="家庭电话" placeholder="非必填" maxlength="13" clearable /> -->
     </van-cell-group>
     <div class="bottom-btn flex">
-      <van-button color="#E9332E" plain v-no-more-click="1000" @click="generateInsureNo" v-if="branchType == '14'">生成投保单号</van-button>
+      <van-button color="#E9332E" plain v-no-more-click="1000" @click="generateInsureNo" v-if="branchType == '14'">
+        生成投保单号
+      </van-button>
       <!--      <van-button type="danger" @click="nextStep" v-no-more-click="1000" class="flex1">下一步</van-button>-->
     </div>
     <!-- <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="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-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="censusShow = false" />
@@ -495,7 +501,9 @@
         </div>
       </div>
       <div style="text-align: center;margin-bottom: 30px;">
-        <van-button round type="danger" size="small" style="padding:0px 35px;font-size: 14px;" @click="isNewPeopleFlagTipshow = false">我知道了</van-button>
+        <van-button round type="danger" size="small" style="padding:0px 35px;font-size: 14px;"
+                    @click="isNewPeopleFlagTipshow = false">我知道了
+        </van-button>
       </div>
     </van-dialog>
     <van-dialog v-model="thisdoubledialogshow" :showConfirmButton="false">
@@ -551,13 +559,18 @@
           style="padding: 0px 35px; font-size: 14px;margin-right: 30px;"
           @click="insureBack()"
           v-if="!insureInfo.orderNo"
-          >退出</van-button
+        >退出
+        </van-button
         >
-        <van-button round type="danger" size="small" style="padding: 0px 35px; font-size: 14px" @click="insureConfirm()" v-if="!insureInfo.orderNo"
-          >确定</van-button
+        <van-button round type="danger" size="small" style="padding: 0px 35px; font-size: 14px" @click="insureConfirm()"
+                    v-if="!insureInfo.orderNo"
+        >确定
+        </van-button
         >
-        <van-button round type="danger" size="small" style="padding: 0px 35px; font-size: 14px" @click="insureNoCompleted()" v-if="insureInfo.orderNo"
-          >完成</van-button
+        <van-button round type="danger" size="small" style="padding: 0px 35px; font-size: 14px"
+                    @click="insureNoCompleted()" v-if="insureInfo.orderNo"
+        >完成
+        </van-button
         >
       </div>
     </van-dialog>
@@ -1006,7 +1019,6 @@ export default {
     //监听名字变化
     nameChange(name) {
       this.userInfo.name = name
-      this.save()
     },
     selectClick(index) {
       selectComp(this, index, '1')
@@ -1065,7 +1077,6 @@ export default {
         }
       })
       this.occupationShowPicker = false
-      this.save()
     },
     //弹框选择
     toSelect(pickerType, valueKey) {
@@ -1215,83 +1226,78 @@ export default {
         this.insuredDialogInfo.idNo = ''
         this.insuredDialogInfo.idType = value.id
       }
-      this.save()
     },
     //证件起始截止日期
     onDateConfirm(val, type) {
       console.log(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('证件起始日期填写错误')
-            }
+        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('证件起始日期填写错误')
+          }
 
-            // 计算年龄
-            if (this.userInfo.idType == '1') {
-              let age = utilsAge.getAge(this.userInfo.birthday, new Date())
-              // 长期按钮是否禁用
-              this.effectiveDateTypeAble = age <= 45
-              if (this.userInfo.birthday && !this.userInfo.certiexpiredate) {
-                this.userInfo.certiexpiredate = countCredentialValidity.getEndDate(this.userInfo.birthday, val)
-                if (this.userInfo.certiexpiredate) {
-                  this.userInfo.certiexpiredate = this.userInfo.certiexpiredate
-                  this.effectiveDateTypeAble = true
-                  this.userInfo.effectiveDateType = false
-                }
+          // 计算年龄
+          if (this.userInfo.idType == '1') {
+            let age = utilsAge.getAge(this.userInfo.birthday, new Date())
+            // 长期按钮是否禁用
+            this.effectiveDateTypeAble = age <= 45
+            if (this.userInfo.birthday && !this.userInfo.certiexpiredate) {
+              this.userInfo.certiexpiredate = countCredentialValidity.getEndDate(this.userInfo.birthday, val)
+              if (this.userInfo.certiexpiredate) {
+                this.userInfo.certiexpiredate = this.userInfo.certiexpiredate
+                this.effectiveDateTypeAble = true
+                this.userInfo.effectiveDateType = false
               }
             }
           }
+        }
           break
-        case '1':
-          {
-            this.userInfo.effectiveDateType = false
-            //如果录入日期早于当前日期
-            if (Date.parse(val) < Date.parse(new Date())) {
-              this.userInfo.certiexpiredate = ''
-              this.$refs.certiexpiredate.date = ''
-              return this.$toast('亲，请您核实投保人身份证件有效期~')
-            }
-            //身份证证件类型的判断
-            if (this.userInfo.idType == '1') {
-              // if(this.userInfo.birthday){
-              // this.userInfo.certificateValidate = countCredentialValidity.getStartDate(this.userInfo.birthday,val)
-              // }
-            }
+        case '1': {
+          this.userInfo.effectiveDateType = false
+          //如果录入日期早于当前日期
+          if (Date.parse(val) < Date.parse(new Date())) {
+            this.userInfo.certiexpiredate = ''
+            this.$refs.certiexpiredate.date = ''
+            return this.$toast('亲，请您核实投保人身份证件有效期~')
           }
+          //身份证证件类型的判断
+          if (this.userInfo.idType == '1') {
+            // if(this.userInfo.birthday){
+            // this.userInfo.certificateValidate = countCredentialValidity.getStartDate(this.userInfo.birthday,val)
+            // }
+          }
+        }
           break
-        case '2':
-          {
-            //出生日期
-            //如果录入日期晚于当前日期
-            if (Date.parse(val) > Date.parse(new Date())) {
-              this.userInfo.birthday = ''
-              this.$refs.birthday.date = ''
-              return this.$toast('出生日期不晚于当日')
-            }
-            //长期判断
-            let age = utilsAge.getAge(this.userInfo.birthday, new Date())
-            if (this.userInfo.idType == '1') {
-              this.effectiveDateTypeAble = !(age > 45)
-            }
-            //年龄18周岁，工作单位默认值为‘无’
-            if (age < 18 && this.branchType != '14') {
-              this.userInfo.workcompany = this.userInfo.workcompany || '无'
-            }
-            if (this.userInfo.certificateValidate && !this.userInfo.certiexpiredate) {
-              this.userInfo.certiexpiredate = countCredentialValidity.getEndDate(this.userInfo.birthday, this.userInfo.certificateValidate)
-            }
-            if (this.userInfo.certiexpiredate && !this.userInfo.certificateValidate) {
-              this.userInfo.certificateValidate = countCredentialValidity.getEndDate(this.userInfo.birthday, this.userInfo.certiexpiredate)
-            }
+        case '2': {
+          //出生日期
+          //如果录入日期晚于当前日期
+          if (Date.parse(val) > Date.parse(new Date())) {
+            this.userInfo.birthday = ''
+            this.$refs.birthday.date = ''
+            return this.$toast('出生日期不晚于当日')
           }
+          //长期判断
+          let age = utilsAge.getAge(this.userInfo.birthday, new Date())
+          if (this.userInfo.idType == '1') {
+            this.effectiveDateTypeAble = !(age > 45)
+          }
+          //年龄18周岁，工作单位默认值为‘无’
+          if (age < 18 && this.branchType != '14') {
+            this.userInfo.workcompany = this.userInfo.workcompany || '无'
+          }
+          if (this.userInfo.certificateValidate && !this.userInfo.certiexpiredate) {
+            this.userInfo.certiexpiredate = countCredentialValidity.getEndDate(this.userInfo.birthday, this.userInfo.certificateValidate)
+          }
+          if (this.userInfo.certiexpiredate && !this.userInfo.certificateValidate) {
+            this.userInfo.certificateValidate = countCredentialValidity.getEndDate(this.userInfo.birthday, this.userInfo.certiexpiredate)
+          }
+        }
           break
       }
-      this.save()
     },
     //选择客户
     chooseCustomer(data) {
@@ -1693,8 +1699,8 @@ export default {
             orderNo: this.$route.query.orderNo
               ? this.$route.query.orderNo
               : this.branchType == '14' && this.insureInfo.orderNo
-              ? this.insureInfo.orderNo
-              : null,
+                ? this.insureInfo.orderNo
+                : null,
             isElecCont: this.isElecCont
           },
           appntDTO: {},
@@ -1808,7 +1814,6 @@ export default {
       } else {
         this.certiexpiredateRequired = true
       }
-      this.save()
     },
     //获取身份证扫描信息
     getIdentityInfo(data) {
@@ -1827,7 +1832,6 @@ export default {
         this.userInfo.stature = ''
         return this.$toast('身高输入有误')
       }
-      this.save()
     },
     //校验体重
     checkAvoirdupois(val) {
@@ -1842,7 +1846,7 @@ export default {
         this.userInfo.avoirdupois = ''
         return this.$toast('体重输入有误')
       }
-      this.save()
+
     },
     getRelatedData(val, source) {
       if (this.userInfo.idType != '1') {
@@ -1875,7 +1879,7 @@ export default {
       } else {
         // this.userInfo.effectiveDateType = false
       }
-      this.save()
+
     },
     reload() {
       location.reload()
@@ -1900,20 +1904,27 @@ export default {
         }
       }
     },
-    "userInfo.sex"(){
-        this.save()
-    }
+    userInfo :{
+      deep: true,
+      async handler() {
+        if (await this.$validator.validate()) {
+          this.nextStep()
+        }else console.log(`validate error`)
+      }
+    },
   }
 }
 </script>
 <style lang="scss" scoped>
 .insured-info-container {
-  /deep/.van-checkbox {
+  /deep/ .van-checkbox {
     margin-left: auto;
   }
-  /deep/.van-radio {
+
+  /deep/ .van-radio {
     margin-left: auto;
   }
+
   .isNewPeopleFlagTipClass {
     margin-top: 45px;
     line-height: 24px;
@@ -1922,11 +1933,13 @@ export default {
     padding: 2px 10px;
   }
 }
+
 .no-border {
-  /deep/.van-cell {
+  /deep/ .van-cell {
     border-bottom: none;
   }
 }
+
 .email-tip {
   color: #999;
   margin: 0 0 10px 20px;

src/views/ebiz/saleFlowProImprove/InsuredPerson.vue

@@ -2071,6 +2071,14 @@ export default {
     this.codeDisabled = false
   },
   watch: {
+    userInfo :{
+      deep: true,
+      async handler() {
+        if (await this.$validator.validate()) {
+          this.nextStep()
+        }else console.log(`validate error`)
+      }
+    },
     async 'withRootUser.value'(n) {
       const orderNo = this.$route.query.orderNo
       if (n && orderNo) {