GFRS-2618【前端】新增津贴申请的基本信息页面的部分代码。提交人--张齐

src/components/ebiz/allowance/application/IndexBar.vue

@@ -103,6 +103,7 @@ export default {
       if (localStorage.allowancePageFlag == '-10' && pageIndex != 4) {
         this.$toast('已到达签名确认流程，不可以回到前面的流程')
       }
+      if (!localStorage.allowancePageFlag) return
       if (Number(localStorage.allowancePageFlag) < Number(pageIndex)) return
       switch (pageIndex) {
         case 1: //跳到基本信息页面
@@ -127,7 +128,7 @@ export default {
           .confirm({
             className: 'dialog-blue',
             title: '提示',
-            message: '离开此页可能会丢失部分数据，是否确认离开？',
+            message: '离开此页可能会丢失部分数据，是否确认离开？'
             // cancelButtonColor: '#E9332E',
             // confirmButtonColor: '#FFFFFF'
           })

src/components/ebiz/allowance/parentList/Parent.vue

@@ -0,0 +1,113 @@
+<template>
+  <div class="parent">
+    <van-index-bar>
+      <div v-if="data.length > 0">
+        <div class=" bg-white mt10  " v-for="parentInfo in data" :key="parentInfo.letter">
+          <van-index-anchor :index="parentInfo.letter" />
+          <div v-for="parent in parentInfo.data" :key="parent.name" class="flex ml15 mt10 pb10 content border-b align-items-c" @click="choose(parent)">
+            <img class="w40  mr15 " src="../../../../assets/images/bnf_avatar.png"/>
+
+            <div class="c-gray-darker fs14">
+              <div>{{ parent.customerName }}</div>
+              <div class="mt5">{{ parent.customerPhone }}</div>
+            </div>
+            <div class="text-right" style="flex:1">
+<!--              <van-tag :color="parent.customerType == 0 ? '#7ED321' : parent.customerType == 1 ? '#5CA7DE' : '#333'" class="mr40" plain>{{-->
+<!--                  parent.typeName-->
+<!--              }}</van-tag>-->
+            </div>
+          </div>
+        </div>
+      </div>
+      <div v-else class="text-center">
+        <img class="mt40 w200"  src="../../../../assets/images/pic_page-non.png"/>
+        <p class="mt15">暂无数据</p>
+      </div>
+    </van-index-bar>
+  </div>
+</template>
+<script>
+import { getCustomersList, getAgentCustomerInfo } from '@/api/ebiz/customer/customer'
+import dataDictionary from '@/assets/js/utils/data-dictionary' //根据数据字典找到用户等级
+import utils from '@/assets/js/business-common'
+import { IndexBar, IndexAnchor, Tag, Icon } from 'vant'
+export default {
+  name: 'Parent',
+  data() {
+    return {
+      data: [],
+      isSuccess: false,
+      type: ['success', 'primary', 'danger', '']
+    }
+  },
+  created() {
+    this.getList()
+  },
+  components: {
+    [IndexBar.name]: IndexBar,
+    [IndexAnchor.name]: IndexAnchor,
+    [Tag.name]: Tag,
+    [Icon.name]: Icon
+  },
+  mounted() {},
+  methods: {
+    choose(data) {
+      let params = {
+        customerNumber: data.customerNumber
+      }
+      getAgentCustomerInfo(params).then(res => {
+        console.log(res, '详情')
+        if (res.result == '0') {
+          this.isSuccess = true
+          let content = res.content
+          if (content.birthday) {
+            content.age = utils.jsGetAge(content.birthday)
+          }
+          this.$emit('on-choose', content)
+        }
+      })
+    },
+    getList() {
+      getCustomersList({}).then(res => {
+        debugger
+        console.log(res)
+        if (res.result == '0') {
+          let customerList = []
+          //根据数据字典中的客户等级 展示
+          for (var key in res.agentCustomerList) {
+            // res.agentCustomerList[key].forEach(current => {
+            //   dataDictionary.customerType.forEach(type => {
+            //     if (current.customerType == type.id) {
+            //       current.typeName = type.text
+            //     }
+            //   })
+            // })
+            let current = {
+              data: res.agentCustomerList[key],
+              letter: key
+            }
+
+            customerList.push(current)
+          }
+          this.data = customerList
+        }
+      })
+    }
+  }
+}
+</script>
+<style lang="scss">
+.parent {
+  .van-index-anchor {
+    padding-top: 2px;
+    padding-bottom: 2px;
+    border-bottom: 1px solid #d6d6d6;
+  }
+  .border-b {
+    border-bottom: 1px solid #d6d6d6;
+  }
+  .content:last-child {
+    border: none;
+  }
+}
+</style>

src/components/ebiz/allowance/parentList/ParentPicker.vue

@@ -0,0 +1,168 @@
+<template>
+  <div id='parent-picker'>
+    <van-field
+      :label='label'
+      v-model='name'
+      @input='onChange'
+      :placeholder='placeholder'
+      :required='required'
+      :right-icon="$assetsUrl + 'images/allowance/avatar.png'"
+      @click-right-icon='chooseParent'
+      :readonly='readonly'
+    />
+    <van-popup v-model='parentShowPicker' position='bottom'>
+      <parent @on-choose='choose' :code='code' :name='name' :life='life' :health='health'></parent>
+    </van-popup>
+  </div>
+</template>
+<script>
+import { Field, Popup, Icon, Sticky } from 'vant'
+import Parent from './Parent'
+
+export default {
+  name: 'ParentPicker',
+  props: {
+    label: {
+      type: String,
+      default: '11'
+    },
+    value: {
+      type: String,
+      default: ''
+    },
+    chooseName: {
+      type: String,
+      default: ''
+    },
+    placeholder: {
+      type: String,
+      default: '请选择'
+    },
+
+    required: {
+      type: Boolean,
+      default: false
+    },
+    data: {
+      type: Array,
+      default: () => {
+      }
+    },
+    //选项对象中，文字对应的 key
+    valueKey: {
+      type: String,
+      default: 'text'
+    },
+    keyId: {},
+    lifeGrade: {
+      type: String,
+      default: ''
+    },
+    healthGrade: {
+      type: String,
+      default: ''
+    },
+    parentShowPicker: {
+      type: Boolean,
+      default: false
+    },
+    readonly: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      name: '',
+      code: '',
+      life: '',
+      health: '',
+      showPicker: false
+    }
+  },
+  components: {
+    [Field.name]: Field,
+    [Popup.name]: Popup,
+    [Icon.name]: Icon,
+    [Sticky.name]: Sticky,
+    Parent
+  },
+  mounted() {
+    this.showPicker = this.parentShowPicker
+  },
+  watch: {
+    value: {
+      handler() {
+        this.name = this.value
+      },
+      immediate: true
+    }
+  },
+  methods: {
+    onChange(value) {
+      let regExp = /\s+/
+      value = value.replace(regExp, '')
+      this.name = value
+      this.$emit('input', value)
+    },
+    choose(data) {
+      this.name = data.customerName
+      this.$emit('on-choose', data)
+    },
+    chooseParent() {
+      if (this.disabled) {
+        return
+      }
+      this.showPicker = true
+      this.$emit('on-click')
+    },
+    cancel() {
+      this.showPicker = false
+      this.$emit('cancel', '')
+    }
+  }
+}
+</script>
+<style lang='scss' scoped>
+#parent-picker {
+  .van-popup--bottom {
+    height: 100%;
+  }
+
+  .van-popup {
+    background: #f5f5f5;
+  }
+
+  /deep/ .van-cell:not(:last-child)::after {
+    position: absolute;
+    box-sizing: border-box;
+    content: ' ';
+    pointer-events: none;
+    right: 0;
+    bottom: 0;
+    left: 4.26667vw;
+    border-bottom: 1px solid transparent;
+    -webkit-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+  }
+}
+
+#parent-picker:not(:last-child)::after {
+  position: absolute;
+  z-index: 99;
+  box-sizing: border-box;
+  content: ' ';
+  pointer-events: none;
+  right: 0;
+  // bottom: 0;
+  // top: 0;
+  left: 4.26667vw;
+  border-bottom: 1px solid #dadada;
+  -webkit-transform: scaleY(0.5);
+  transform: scaleY(0.5);
+}
+</style>

src/views/ebiz/allowance/application/AccountInfo.vue

@@ -131,7 +131,6 @@ export default {
       isClear: false,  //是否清空
       inputShow: true, //模糊查询功能
       islistShow: false, //控制显示或隐藏选择银行的弹窗的变量
-      cardAuthCount: 0,
       isPassedCardCheck: false,
       allowancePageFlag: '2' // 定义顶部导航记录当前展示的是第几个页面或流程的标识
     }
@@ -364,7 +363,7 @@ export default {
           idNo: cardData.idNo,
           name: cardData.name,
           bankNo: this.bankId,
-          whiteType: 'sale_bank_check'
+          whiteType: 'allowance_bank_check'
         })
         console.log('白名单查询结果: ', whiteRes)
         if (whiteRes.result === '0') {
@@ -383,7 +382,6 @@ export default {
             let res = await checkCard(cardData)
             this.$toast.clear()
             if (res.result !== '0') {
-              this.cardAuthCount++
               if (!res.resultMessage) {
                 return this.$toast('当前系统繁忙，请重新输入银行卡号！')
               }
@@ -431,8 +429,10 @@ export default {
             //如果从津贴申请列表编辑按钮或者新增津贴申请进入
             localStorage.allowancePageFlag = '3'
           }
-          //
+          // 给‘allowanceUserInfo’缓存中新增加一个判断是否勾选了享受人无银行卡/手机号选项的数据
-          // JSON.parse(that.$CacheUtils.getLocItem('allowanceUserInfo')).isSelf = this.accountBankInfo.isSelf
+          let allowanceLocal = JSON.parse(that.$CacheUtils.getLocItem('allowanceUserInfo'))
+          allowanceLocal.isSelf = this.accountBankInfo.isSelf
+          that.$CacheUtils.setLocItem('allowanceUserInfo', JSON.stringify(allowanceLocal))
           // 跳转到账户信息页面
           this.$jump({
             flag: 'h5',

src/views/ebiz/allowance/application/AttachmentManagement.vue

@@ -2,8 +2,8 @@
   <div class='redRadioCheckbox'>
     <index-bar></index-bar>
     <div>
-      <div class='m20 bg-white'>
+      <div class='bg-white'>
-        <div class='p10'>
+        <div>
           <van-cell-group>
             <van-field required label='申请人居民身份证正面' disabled />
           </van-cell-group>

src/views/ebiz/allowance/application/BaseInfo.vue

@@ -48,17 +48,18 @@
           <img src='@/assets/images/saomiao_allowance.png' alt='' class='san_button mb10' />
         </van-button>
       </van-field>
-      <customer-picker
+      <parent-picker
         v-model='enjoyUserInfo.name'
-        @on-choose='chooseCustomer'
+        @on-choose='chooseParent'
         v-validate="'required|salename'"
         name='享受人姓名'
         label='享受人姓名'
         required
-        :parentShowPicker.sync='customerShowPicker'
+        :parentShowPicker.sync='parentShowPicker'
         @nameChange='nameChange'
         @on-click="selectClick('1')"
-      ></customer-picker>
+        placeholder='请输入享受人姓名'
+      ></parent-picker>
       <select-radio
         :value.sync='enjoyUserInfo.relationship'
         required
@@ -148,7 +149,7 @@ import utilsAge from '@/assets/js/utils/age'
 import { selectComp, getApplicantIdentityInfo, getEnjoyUserIdentityInfo } from '../js/methods'
 import IdentityCardScan from '@/components/ebiz/sale/IdentityCardScan'
 import { idToData } from '../js/verification'
-import CustomerPicker from '@/components/ebiz/customer/CustomerPicker'
+import ParentPicker from '@/components/ebiz/allowance/parentList/ParentPicker'
 import SelectRadio from '@/components/ebiz/SelectRadio'
 import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
 import idNoCheck from '@/assets/js/utils/idNoCheck'
@@ -170,9 +171,9 @@ export default {
     [Field.name]: Field,
     [Popup.name]: Popup,
     [IdentityCardScan.name]: IdentityCardScan,
-    [CustomerPicker.name]: CustomerPicker,
     [SelectRadio.name]: SelectRadio,
-    [FieldDatePicter.name]: FieldDatePicter
+    [FieldDatePicter.name]: FieldDatePicter,
+    ParentPicker
     // [OccupationPicker.name]: OccupationPicker,
     // [CellGroup.name]: CellGroup,
     // [Checkbox.name]: Checkbox,
@@ -188,10 +189,11 @@ export default {
     return {
       // 定义存储申请人信息的对象
       applicantInfo: {
-        agentCode: '1', // 申请人工号
+        agentCode: '', // 申请人工号
-        name: '1', // 申请人姓名
+        name: '', // 申请人姓名
         idType: '1', // 证件类型 (枚举值)
-        idNo: '' // 证件号码
+        idNo: '', // 证件号码
+        allowanceNo: '' // 津贴申请流水号，也用于在点击下一步时，传给后台，后台去判断是新增操作还是编辑操作
       },
       // 定义存储享受人信息的对象
       enjoyUserInfo: {
@@ -210,7 +212,8 @@ export default {
         ],
         idType: '1', // 证件类型 (枚举值)
         idNo: '', // 证件号码
-        birthday: ''
+        birthday: '', // 出生日期
+        id: '' // id标识，也用于在点击下一步时，传给后台，后台去判断是新增操作还是编辑操作
         // 定义出生日子可选的最大日期
         // （60表示60岁，代表只能选择比60岁大的出生日期，因为父母津贴功能贵司规定父母年龄需大于60岁才能领取津贴）
         // maxDate: beforeDate.getBeforeYear(60)
@@ -219,7 +222,7 @@ export default {
       popupShow: false, // 定义控制显示或隐藏popup弹出层的变量
       columns: [], // 定义popup弹出层中的数据集合
       currentPopupIndex: '',
-      customerShowPicker: false,
+      parentShowPicker: false,
       isScanApplicant: false, // 申请人模块是否显示证件扫描组件
       isScanEnjoyUser: false, // 享受人人模块是否显示证件扫描组件
       allowancePageFlag: '1', // 定义顶部导航记录当前展示的是第几个页面或流程的标识
@@ -228,44 +231,8 @@ export default {
     }
   },
   created() {
-    if (this.$route.query.edit) {
+    // 调用初始化方法
-      const orderNo = this.$CacheUtils.getLocItem('orderNo')
+    this.init()
-      getOrderDetail({ orderNo: orderNo }).then((res) => {
-        if (res.result == 0) {
-          //投保人信息返显
-          this.userInfo = res.orderDTO.appntDTO
-          this.setCustomerMarriage(res.orderDTO.appntDTO.marriage)
-          //是否长期
-          this.userInfo.effectiveDateType = res.orderDTO.appntDTO.effectiveDateType == 'false' ? false : true
-          //有无社保
-          this.userInfo.medical = res.orderDTO.appntDTO.medical
-          //设为联系地址
-          // this.userInfo.addressStatus = '0'
-          //证件类型
-          // this.userInfo.idType = '1'
-          //国家/地区
-          // this.userInfo.nativeplace = '1'
-          this.$utils.intLocalStorage(res)
-
-          if (this.$route.query.edit && !this.$route.query.salePageFlag) {
-            //如果从保单列表点击编辑按钮进入
-            this.salePageFlag = '1'
-            localStorage.setItem('salePageFlag', this.salePageFlag)
-          } else {
-            this.homeName = getAreaName([
-              { code: res.orderDTO.appntDTO.homeProvince },
-              { code: res.orderDTO.appntDTO.homeCity },
-              { code: res.orderDTO.appntDTO.homeArea }
-            ]) //获取联系地址
-            // this.census = getAreaName([{ code: res.orderDTO.appntDTO.householdProvince }, { code: res.orderDTO.appntDTO.householdCity }]) //获取户籍
-          }
-
-        }
-      })
-    } else {
-      localStorage.setItem('salePageFlag', this.salePageFlag)
-      this.$CacheUtils.setLocItem('allowanceUserInfo', '')
-    }
   },
   mounted() {
     setTimeout(() => {
@@ -279,6 +246,71 @@ export default {
     window.appCallBack = this.appCallBack
   },
   methods: {
+    /**
+     * @Description: 初始化判断是新增操作还是编辑操作的类型，根据不同操作类型调用不同接口查询数据
+     * @author:zhangqi
+     * @Date:2021-09-14
+     */
+    init() {
+      // 判断是新增操作还是编辑操作的类型，根据不同操作类型调用不同接口查询数据
+      if (this.$route.query.edit) {
+        // 从存储申请人和享受人信息的缓存中获取'allowanceNo'津贴流水号，然后定义参数格式
+        let params = {
+          allowanceNo: JSON.parse(this.$CacheUtils.getLocItem('allowanceUserInfo')).allowanceNo
+        }
+        // 调用查询津贴申请详情数据的接口
+        getAllowanceDetail(params).then((res) => {
+          if (res.result == 0) {
+            // 把数据赋值给一个新的变量
+            let data = res.content.allowanceDTO
+            // 赋值申请人工号
+            this.applicantInfo.agentCode = data.allowanceApplyDTO.agentCode
+            // 赋值申请人姓名
+            this.applicantInfo.name = data.allowanceApplyDTO.name
+            // 赋值申请人证件类型
+            this.applicantInfo.idType = data.allowanceApplyDTO.idType
+            // 赋值申请人证件号码
+            this.applicantInfo.idNo = data.allowanceApplyDTO.idNo
+            // 赋值津贴申请流水号
+            this.applicantInfo.allowanceNo = data.allowanceApplyDTO.allowanceNo
+            // 赋值享受人姓名
+            this.enjoyUserInfo.name = data.allowanceEnjoyDTO.name
+            // 赋值享受人角色
+            this.enjoyUserInfo.relationship = data.allowanceEnjoyDTO.relationship
+            // 赋值享受人证件类型
+            this.enjoyUserInfo.idType = data.allowanceEnjoyDTO.idType
+            // 赋值享受人证件号码
+            this.enjoyUserInfo.idNo = data.allowanceEnjoyDTO.idNo
+            // 赋值享受人性别
+            this.enjoyUserInfo.sex = data.allowanceEnjoyDTO.sex
+            // 赋值享受人出生日期
+            this.enjoyUserInfo.birthday = data.allowanceEnjoyDTO.birthday
+            // 赋值id标识
+            this.enjoyUserInfo.id = data.allowanceEnjoyDTO.id
+            //如果从津贴申请列表点击编辑按钮进入
+            if (this.$route.query.edit && !this.$route.query.allowancePageFlag) {
+              this.allowancePageFlag = '1'
+              localStorage.setItem('allowancePageFlag', this.allowancePageFlag)
+            }
+          }
+        })
+      } else {
+        // 调用查询用户信息的接口
+        getAgentInfo({}).then(res => {
+          if (res.result == 0) {
+            // 赋值申请人工号
+            this.applicantInfo.agentCode = res.jobNo
+            // 赋值申请人姓名
+            this.applicantInfo.name = res.name
+          }
+        }).catch(err => {
+          console.log(err)
+        })
+        localStorage.setItem('allowancePageFlag', this.allowancePageFlag)
+        this.$CacheUtils.setLocItem('allowanceUserInfo', '')
+      }
+    },
+
     /**
      * @Description: 页面左上角关闭事件的回调方法
      * @author:zhangqi
@@ -321,7 +353,7 @@ export default {
           }
         })
         if (this.currentPopupIndex == 1) {
-          this.customerShowPicker = false
+          this.parentShowPicker = false
         } else if (this.currentPopupIndex == 3) {
           this.isScanApplicant = false
         } else if (this.currentPopupIndex == 4) {
@@ -374,9 +406,9 @@ export default {
      * @author:zhangqi
      * @Date:2021-09-08
      */
-    chooseCustomer(data) {
+    chooseParent(data) {
       console.log('data :>> ', data)
-      this.customerShowPicker = false
+      this.parentShowPicker = false
       this.$jump({
         flag: 'navigation',
         extra: {

src/views/ebiz/allowance/js/methods.js

@@ -4,7 +4,7 @@ export function selectComp(that, index, type = '') {
   let title = ''
   // index：1-父母列表；2-职业类别；3-弹出申请人身份证扫描功能；4-弹出享受人身份证扫描功能
   if (index == 1) {
-    ;[that.customerShowPicker, title] = [true, '父母列表']
+    ;[that.parentShowPicker, title] = [true, '父母列表']
   } else if (index == 2) {
     ;[that.occupationShowPicker, title] = [true, '职业类别']
   } else if (index == 3) {