受益人变更增加字段

src/views/ebiz/preserve/bc/BeneficiaryInfoAdd.vue

@@ -100,6 +100,55 @@
       <div class="border-bt relative fs14 p10 flex align-center">
         <van-checkbox v-model="userInfo.effectiveDateType" class="fr" :disabled="effectiveDateTypeAble" @change="effectiveDataTypeChange">长期</van-checkbox>
       </div>
+      <van-field
+        :value="userInfo.marriageStatus"
+        readonly
+        required
+        label="婚姻状况"
+        name="婚姻状况"
+        v-validate="'required'"
+        right-icon="arrow"
+        placeholder="请选择"
+        @click="setMarriageStatus('10')"
+      />
+      <occupation-picker
+        :value.sync="userInfo.occupationCode"
+        :chooseName.sync="userInfo.occupationType"
+        :lifeGrade.sync="userInfo.lifeGrade"
+        :healthGrade.sync="userInfo.healthGrade"
+        clearable
+        label="职业类别"
+        name="职业类别"
+        required
+        v-validate="'required'"
+        placeholder="请选择"
+        :parentShowPicker.sync="occupationShowPicker"
+        @on-click="selectClick('2')"
+        @on-choose="chooseOccupation"
+      />
+      <van-field
+        v-model="userInfo.yearSalary"
+        label="平均年收入（万元）"
+        name="平均年收入"
+        required
+        placeholder="请输入，单位万元"
+        v-validate="'required|onlyNumber'"
+        data-vv-name="平均年收入"
+        clearable
+        maxlength="5"
+      />
+      <van-field
+        v-model="areaName"
+        readonly
+        label="联系地址"
+        name="联系地址"
+        required
+        right-icon="arrow"
+        placeholder="请选择"
+        v-validate="'required'"
+        @click="chooseArea"
+      />
+      <van-field v-model="userInfo.contactAddress" label="" name="详细地址" placeholder="请输入详细地址" v-validate="'required'" clearable maxlength="30" />
 
       <van-field v-model="userInfo.bnfOrder" required readonly label="受益顺序" name="受益顺序" placeholder="请输入" maxlength="1" />
       <van-field
@@ -125,34 +174,7 @@
           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.postalAddress" label="" name="详细地址" placeholder="请输入详细地址" v-validate="'required'" clearable maxlength="30" />
         <van-field v-model="userInfo.email" required 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="请选择"
-          :parentShowPicker.sync="occupationShowPicker"
-          @on-click="selectClick('2')"
-          @on-choose="chooseOccupation"
-        />
       </template>
     </van-cell-group>
     <van-button type="danger" class="bottom-btn" @click="nextStep" v-no-more-click="1000">添加</van-button>
@@ -170,6 +192,9 @@
         <p class="p15 pb20 fs14 text-center">当前顺位受益比例总和不能超过100%</p>
       </van-dialog>
     </div>
+    <van-popup v-model="isMarriageStatusShow" position="bottom">
+      <van-picker show-toolbar :columns="columns" @confirm="onMarriageConfirm" @cancel="isMarriageStatusShow = false" />
+    </van-popup>
   </div>
 </template>
 
@@ -207,6 +232,7 @@ export default {
   },
   data() {
     return {
+      isMarriageStatusShow: false,
       isDetailFlag: '0', //是否需要填写手机号等详细信息 0-是 1-否
       dialogShow: false, //错误弹窗是否显示
       effectiveDateTypeAble: true, //长期按钮是否禁用
@@ -261,7 +287,8 @@ export default {
         postalAddress: '', //详细地址
         occupationCode: '',
         occupationType: '',
-        occupationName: '',
+        yearSalary: '',
+        contactAddress: '',
         area: '',
         bnfLot: '', //受益比例
 
@@ -296,6 +323,22 @@ export default {
   },
   mounted() {},
   methods: {
+    setMarriageStatus() {
+      this.isMarriageStatusShow = true
+      this.columns = [
+        { id: 1, text: '已婚' },
+        { id: 2, text: '单身' }
+      ]
+    },
+    onMarriageConfirm(value) {
+      this.userInfo.marriageStatus = value.text
+      if (value.text === '已婚') {
+        this.userInfo.marriage = '1'
+      } else {
+        this.userInfo.marriage = '2'
+      }
+      this.isMarriageStatusShow = false
+    },
     appCallBack(data) {
       if (data.trigger == 'right_button_click') {
         // 筛选按钮的点击事件
@@ -427,7 +470,7 @@ export default {
         this.userInfo.idExpDate = data.idEffectEndDate //证件截止日期
       }
       this.userInfo.occupationCode = data.occupationCode //职业类别编码
-      this.userInfo.occupationName = data.occupationName //职业类别名称
+      this.userInfo.occupationCode = data.occupationCode //职业类别名称
       this.userInfo.lifeGrade = data.lifeGrade //寿险等级
       this.userInfo.healthGrade = data.healthGrade //健康等级
       // //计算年龄