GFRS-2759【前端】开发柳州需求投保风险提示书的页面--提交人：张齐

src/api/ebiz/sale/sale.js

@@ -1,6 +1,7 @@
 import request from '@/assets/js/utils/request'
 import request1 from '@/assets/js/utils/request1'
 import getUrl from '@/assets/js/utils/get-url'
+
 // 保费计算
 export function saveOrUpdateOrderInfo(data) {
   return request({
@@ -9,6 +10,7 @@ export function saveOrUpdateOrderInfo(data) {
     data
   })
 }
+
 //人核转线上支付判断是否可进行支付操作
 export function payFlag(data) {
   return request({
@@ -17,6 +19,7 @@ export function payFlag(data) {
     data
   })
 }
+
 // 订单列表
 export function orderList(data) {
   return request({
@@ -25,6 +28,7 @@ export function orderList(data) {
     data
   })
 }
+
 // 订单删除
 export function deleteOrderInfo(data) {
   return request({
@@ -60,6 +64,7 @@ export function getOrderDetail(data) {
     data
   })
 }
+
 export function getOrderDetail1(data) {
   return request({
     url: getUrl('/sale/order/orderDetail', 1),
@@ -67,6 +72,7 @@ export function getOrderDetail1(data) {
     data
   })
 }
+
 // 获取验证码
 export function getAuthCode(data) {
   return request({
@@ -75,6 +81,7 @@ export function getAuthCode(data) {
     data
   })
 }
+
 // 验证验证码
 export function autchCodeCheck(data) {
   return request({
@@ -83,6 +90,7 @@ export function autchCodeCheck(data) {
     data
   })
 }
+
 // 上传图片
 export function uploadImg(data) {
   return request1({
@@ -91,6 +99,7 @@ export function uploadImg(data) {
     data
   })
 }
+
 /*
 // 人脸识别
 export function recognition(data) {
@@ -281,6 +290,7 @@ export function saveOrderActiveType(data) {
     data
   })
 }
+
 // 移动端活动列表
 export function getActivityList(data) {
   return request({
@@ -317,3 +327,13 @@ export function CommitmentSelfCheck(data) {
     data
   })
 }
+
+
+// 获取柳州分红万能投连型产品编码集合
+export function getUniversalCodeLst(data) {
+  return request({
+    url: getUrl('/sale/product/getUniversalCodeLst', 1),
+    method: 'post',
+    data
+  })
+}

src/views/ebiz/sale/InsuranceRiskReminder.vue

@@ -5,50 +5,50 @@
     <div class='m20 question-option'>
       <span class='question'>1.请问投保时投保单/《电子投保确认单》上是您和被保险人(或被保险人的监护人)的亲笔签名吗?</span>
       <van-radio-group class='mt10' v-model='radio1' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=1>是</van-radio>
+        <van-radio name='1'>是</van-radio>
-        <van-radio :name=0>否</van-radio>
+        <van-radio name='0'>否</van-radio>
       </van-radio-group>
     </div>
     <div class='m20 question-option'>
       <span class='question'>2.您对保险单的保险期间（保多久）、保险金额（保多少）、保险费（交多少）、交费方式（交多久）是否了解？</span>
       <van-radio-group class='mt10' v-model='radio2' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=1>了解</van-radio>
+        <van-radio name='1'>了解</van-radio>
-        <van-radio :name=0>不清楚</van-radio>
+        <van-radio name='0'>不清楚</van-radio>
       </van-radio-group>
     </div>
     <div class='m20 question-option'>
       <span class='question'>3.您对保险单的保险责任（保什么）和责任免除（什么情况是不赔的）是否了解？</span>
       <van-radio-group class='mt10' v-model='radio3' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=1>了解</van-radio>
+        <van-radio name='1'>了解</van-radio>
-        <van-radio :name=0>不清楚</van-radio>
+        <van-radio name='0'>不清楚</van-radio>
       </van-radio-group>
     </div>
     <div class='m20 question-option'>
       <span class='question'>4.业务人员在销售过程中是否存在向您返还佣金或其他诱导投保的行为？</span>
       <van-radio-group class='mt10' v-model='radio4' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=0>是</van-radio>
+        <van-radio name='0'>是</van-radio>
-        <van-radio :name=1>否</van-radio>
+        <van-radio name='1'>否</van-radio>
       </van-radio-group>
     </div>
     <div class='m20 question-option'>
       <span class='question'>5.从签收保险单次日起有10-15天的犹豫期，犹豫期内申请撤销保险单，可退还所交保险费，您是否了解？</span>
       <van-radio-group class='mt10' v-model='radio5' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=1>了解</van-radio>
+        <van-radio name='1'>了解</van-radio>
-        <van-radio :name=0>不清楚</van-radio>
+        <van-radio name='0'>不清楚</van-radio>
       </van-radio-group>
     </div>
     <div class='m20 question-option'>
       <span class='question'>6.犹豫期后退保可能会有一定损失，保险单的现金价值就是退保金额，您是否了解？</span>
       <van-radio-group class='mt10' v-model='radio6' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=1>是</van-radio>
+        <van-radio name='1'>是</van-radio>
-        <van-radio :name=0>否</van-radio>
+        <van-radio name='0'>否</van-radio>
       </van-radio-group>
     </div>
     <div class='m20 question-option'>
       <span class='question'>7.投保时故意未履行如实告知义务，将面临拒赔的风险，并不退还保险费。请问您是否已如实告知健康状况、既往病史和投保信息等情况？</span>
       <van-radio-group class='mt10' v-model='radio7' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=1>是</van-radio>
+        <van-radio name='1'>是</van-radio>
-        <van-radio :name=0>否</van-radio>
+        <van-radio name='0'>否</van-radio>
       </van-radio-group>
     </div>
 
@@ -61,22 +61,22 @@
         请问您是否了解？
       </span>
       <van-radio-group class='mt10' v-model='radio8' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=1>了解</van-radio>
+        <van-radio name='1'>了解</van-radio>
-        <van-radio :name=0>不清楚</van-radio>
+        <van-radio name='0'>不清楚</van-radio>
       </van-radio-group>
     </div>
     <div class='m20 question-option' v-if='flag'>
       <span class='question'>9.业务人员是否向您承诺或保证过分红收益/超过最低保证利率的收益/投资回报？</span>
       <van-radio-group class='mt10' v-model='radio9' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=0>是</van-radio>
+        <van-radio name='0'>是</van-radio>
-        <van-radio :name=1>否</van-radio>
+        <van-radio name='1'>否</van-radio>
       </van-radio-group>
     </div>
     <div class='m20 question-option' v-if='flag'>
       <span class='question'>10.您投保的是一款保险产品，不能等同于银行的存款和理财产品，您是否了解？</span>
       <van-radio-group class='mt10' v-model='radio10' direction='horizontal' :disabled='isSign'>
-        <van-radio :name=1>了解</van-radio>
+        <van-radio name='1'>了解</van-radio>
-        <van-radio :name=0>不清楚</van-radio>
+        <van-radio name='0'>不清楚</van-radio>
       </van-radio-group>
     </div>
 
@@ -106,13 +106,13 @@
     <div class='bg-white bottom-btn'>
       <div class='p15 pl40 flex align-items-c'>
         <span class='mr10'>本人签名 :</span>
-        <div>
+        <div v-if="signVal == '0' || signVal == '2'">
-          <van-button type='danger' size='small' @click="sign('0')" v-no-more-click='1000'>
+          <van-button type='danger' size='small' @click='sign()' v-no-more-click='1000'>
             {{ appntSign.documentStatus == '2' ? '签名' : '已签名' }}
           </van-button>
         </div>
       </div>
-      <van-button type='danger' size='large' :disabled='!isSign' v-no-more-click='1000'>完成</van-button>
+      <van-button type='danger' size='large' :disabled='isDisabledComplite' v-no-more-click='1000'>完成</van-button>
     </div>
   </div>
 </template>
@@ -120,6 +120,7 @@
 <script>
 import { RadioGroup, Radio } from 'vant'
 import utils from '@/assets/js/utils/date-utils'
+import { saveInformation, getOrderDetail, getUniversalCodeLst } from '@/api/ebiz/sale/sale'
 
 export default {
   name: 'InsuranceRiskReminder',
@@ -141,44 +142,393 @@ export default {
       radio8: '', // 第8题的选中项
       radio9: '', // 第9题的选中项
       radio10: '', // 第10题的选中项
+      signVal: '', // 投保人还是被保险人信息
       saleInsuredInfo: {},// 存储local带来的投保人信息对象
       productCode: localStorage.productCode, // 从缓存中获取险种产品编号
       flag: '', // 根据险种编号判断页面是否展示8-10题的标识；因为选择投保'分红/万能/投资连结保险'，页面需要展示1-10题,
-      appntSign: {},// 投保人签名信息
       idType: '', // 证件类型
       idNo: '', // 证件号码
       orderNo: localStorage.lastOrderNo, // 从缓存中获取投保单号
       fillDate: utils.formatDate(new Date(), 'yyyy年MM月dd日'), // 获取当前日期
-      isSign: false // 是否签名了
+      appntSign: {}, // 投保人签名信息
+      tipsPolicyUrl: '',
+      isSign: false, // 是否签名了
+      base64: '', // sign加密码
+      isDisabledComplite: true // 是否可以点击
     }
   },
   created() {
+    if (!this.isWeixin) {
+      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
+    }
     // 调用初始化方法
     this.init()
   },
   methods: {
+    /**
+     * @Description: 页面左上角原生方法
+     * @author:zhangqi
+     * @Date:2021-10-12
+     */
+    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
+          })
+      }
+    },
+
     /**
      * @Description: 初始化方法
      * @author:zhangqi
      * @Date:2021-10-12
      */
     init() {
-      // 获取投保人的缓存数据，并赋值给变量
+      // 从缓存中获取数据，并赋值给变量
+      this.signVal = window.localStorage.getItem('sign-val')
+      // 从缓存中获取投保人的数据，并赋值给变量
       this.saleInsuredInfo = JSON.parse(this.$CacheUtils.getLocItem('saleInsuredInfo'))
       // 获取证件类型
       this.idType = this.saleInsuredInfo.idType
       // 获取证件号码
       this.idNo = this.saleInsuredInfo.idNo
-      // 判断当前的险种类型编号，
+      // 调用获取柳州分红万能投连型产品编码集合的方法
-      // 如果选择投保'非分红/万能/投资连结保险'，只需填写1-7题，页面仅展示1-7题；
+      this.getUniversalCodeLstFunc()
-      // 如果选择投保'分红/万能/投资连结保险'，需填写1-10题,页面展示1-10题；
+      // 调用查询详情数据的方法
-      // GFRS_M0015 与 GFRS_M0017 是两款万能险的险种产品编号
+      this.getOrderDetail()
-      if (this.productCode === 'GFRS_M0015' || this.productCode === 'GFRS_M0017') {
+    },
-        // 设置页面展示1-10题
+
-        this.flag = true
+    /**
+     * @Description: 获取柳州分红万能投连型产品编码集合的方法
+     * @author:zhangqi
+     * @Date:2021-10-14
+     */
+    getUniversalCodeLstFunc() {
+      // 重置清空根据险种编号判断页面是否展示8-10题的标识的变量，防止数据缓存
+      this.flag = ''
+      getUniversalCodeLst({ 'platform': 'app' }).then(res => {
+        if (res.result == '0') {
+          // 循环数据，判断数据集合中是否存在'分红/万能/投资连结保险'等产品的险种编号
+          // 如果选择投保'非分红/万能/投资连结保险'，只需填写1-7题，页面仅展示1-7题；
+          // 如果选择投保'分红/万能/投资连结保险'，需填写1-10题,页面展示1-10题；
+          // GFRS_M0015 与 GFRS_M0017 是两款万能险的险种产品编号
+          this.flag = res.content.some(item => {
+            return item === this.productCode
+          })
+        }
+      })
+    },
+
+    /**
+     * @Description: 查询详情数据的方法
+     * @author:zhangqi
+     * @Date:2021-10-13
+     */
+    getOrderDetail() {
+      let that = this
+      let data = {
+        orderNo: window.localStorage.getItem('orderNo')
+      }
+      return new Promise((resolve, reject) => {
+        getOrderDetail(data).then(res => {
+          if (res.result == '0') {
+            res.orderDTO.ebizSignDTOS.map(item => {
+              if (item.documentCode == '11') {
+                if (item.signType == '0' || item.signType == '2') {
+                  that.appntSign = item
+                  that.tipsPolicyUrl = item.policyUrl
+                }
+              }
+            })
+            if (that.isWeixin) {
+              if (res.orderDTO.ebizSignDTOS.length > 1) {
+                if (that.appntSign.documentStatus == '3') {
+                  that.isDisabledComplite = false
+                }
+              }
+            }
+            resolve('success')
+          }
+        })
+      })
+    },
+
+    /**
+     * @Description: 点击‘签名’时，触发的方法
+     * @author:zhangqi
+     * @Date:2021-10-12
+     */
+    sign(val) {
+      let that = this
+      this.$toast.loading({
+        duration: 0, // 持续展示 toast
+        forbidClick: true, // 禁用背景点击
+        loadingType: 'spinner',
+        message: '加载中……'
+      })
+      // 判断当有题目未作答时，要进行提示
+      if (this.radio1 === '') {
+        this.$toast('第1题未作答')
+        return
+      } else if (this.radio2 === '') {
+        this.$toast('第2题未作答')
+        return
+      } else if (this.radio3 === '') {
+        this.$toast('第3题未作答')
+        return
+      } else if (this.radio4 === '') {
+        this.$toast('第4题未作答')
+        return
+      } else if (this.radio5 === '') {
+        this.$toast('第5题未作答')
+        return
+      } else if (this.radio6 === '') {
+        this.$toast('第6题未作答')
+        return
+      } else if (this.radio7 === '') {
+        this.$toast('第7题未作答')
+        return
+      } else if (this.flag) {
+        // 当前的险种产品类型如果是'分红/万能/投资连结保险'，则需要对8-10题进行校验
+        if (this.radio8 === '') {
+          this.$toast('第8题未作答')
+          return
+        } else if (this.radio9 === '') {
+          this.$toast('第9题未作答')
+          return
+        } else if (this.radio10 === '') {
+          this.$toast('第10题未作答')
+          return
+        }
+      }
+      // 判断已作答的题目选择的答案是否是正确选项，如果不是正确选项要进行提示
+      if (this.radio1 !== '1') {
+        this.$toast('您的第1题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+        return
+      } else if (this.radio2 !== '1') {
+        this.$toast('您的第2题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+        return
+      } else if (this.radio3 !== '1') {
+        this.$toast('您的第3题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+        return
+      } else if (this.radio4 !== '1') {
+        this.$toast('您的第4题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+        return
+      } else if (this.radio5 !== '1') {
+        this.$toast('您的第5题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+        return
+      } else if (this.radio6 !== '1') {
+        this.$toast('您的第6题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+        return
+      } else if (this.radio7 !== '1') {
+        this.$toast('您的第7题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+        return
+      } else if (this.flag) {
+        // 当前的险种产品类型如果是'分红/万能/投资连结保险'，则需要对8-10题进行校验
+        if (this.radio8 !== '1') {
+          this.$toast('您的第8题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+          return
+        } else if (this.radio9 !== '1') {
+          this.$toast('您的第9题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+          return
+        } else if (this.radio10 !== '1') {
+          this.$toast('您的第10题回答不符合投保要求，请您了解相关投保风险后再进行投保')
+          return
+        }
+      }
+      if (this.isWeixin) {
+        this.toAirSign('0', '签字日期', '-150', '2')
       } else {
-        // 设置页面不需要展示1-10题，仅展示1-7题即可
+        EWebBridge.webCallAppInJs('ca_sign', {
-        this.flag = false
+          number: that.saleInsuredInfo.idNo, // 身份证号码
+          name: that.saleInsuredInfo.name, // 姓名
+          type: that.saleInsuredInfo.idType, // 证件类型
+          keyword: '签字日期',
+          pageNo: '1',
+          index: '1',
+          offset: '-150',
+          pos: '3',
+          signatureWidth: this.$utils.signParams().signatureWidth,
+          signatureHeight: this.$utils.signParams().signatureHeight
+        }).then(data => {
+          this.$toast.clear()
+          if (JSON.parse(data).state == '1') {
+            // 将签名数据进行加密，并赋值给变量
+            that.base64 = decodeURI(JSON.parse(data).sign)
+            // 设置签名状态
+            that.appntSign.documentStatus = '3'
+            that.isSign = true
+            that.isDisabledComplite = false
+          }
+        })
+      }
+    },
+    toAirSign(status, keyword, offset, originStatus) {
+      localStorage.setItem(
+        'signInfo',
+        JSON.stringify({
+          originStatus: originStatus,
+          idNo: this.saleInsuredInfo.idNo,
+          name: this.saleInsuredInfo.name,
+          type: this.saleInsuredInfo.idType,
+          keyword: keyword,
+          status: status,
+          offset: offset,
+          originUrl: location.href
+        })
+      )
+      window.location.href = this.$mainUrl + '/sign/index.html'
+    },
+
+    /**
+     * @Description: 点击页面底部‘完成’按钮时，触发的方法
+     * @author:zhangqi
+     * @Date:2021-10-13
+     */
+    goNext() {
+      if (this.isWeixin) {
+        console.log('````````````````````')
+        console.log('进入微信')
+        this.$toast.loading({
+          duration: 0, // 持续展示 toast
+          forbidClick: true, // 禁用背景点击ase
+          loadingType: 'spinner',
+          message: '加载中……'
+        })
+        let that = this
+        if (that.signVal == '0' || that.signVal == '2') {
+          let data = {
+            orderType: 'SIGN_ORDER',
+            orderDTO: {
+              orderInfoDTO: {
+                orderNo: window.localStorage.getItem('orderNo')
+              },
+              ebizSignDTOS: [
+                {
+                  signOrRead: 'tip',
+                  signId: that.appntSign.signId,
+                  orderNo: window.localStorage.getItem('orderNo'),
+                  documentCode: that.appntSign.documentCode,
+                  documentStatus: '3',
+                  documentType: that.appntSign.documentType,
+                  signType: that.signVal,
+                  baseEncryp: that.base64,
+                  tipsPolicyUrl: that.tipsPolicyUrl
+                }
+              ]
+            }
+          }
+          saveInformation(data).then(res => {
+            if (res.result == '0') {
+              this.$toast.clear()
+              window.localStorage.setItem('detailJump', '')
+              sessionStorage.twowxSigned = false
+              let doubleRecordFlag = localStorage.doubleRecordFlag
+              let routeUrl = '/sale/signatureOfElectronic'
+              if (doubleRecordFlag == '1') {
+                // 跳转双录签署文件
+                routeUrl = '/sale/avoidDutyTip'
+              }
+              this.$jump({
+                flag: 'h5',
+                extra: {
+                  url: location.origin + '/#' + routeUrl
+                },
+                routerInfo: {
+                  path: routeUrl
+                }
+              })
+            } else {
+              that.$toast(res.resultMessage)
+            }
+          })
+        }
+      } else {
+        let that = this
+        this.$toast.loading({
+          duration: 0, // 持续展示 toast
+          forbidClick: true, // 禁用背景点击
+          loadingType: 'spinner',
+          message: '加载中……'
+        })
+        if (that.signVal == '0' || that.signVal == '2') {
+          let data = {
+            orderType: 'SIGN_ORDER',
+            orderDTO: {
+              orderInfoDTO: {
+                orderNo: window.localStorage.getItem('orderNo')
+              },
+              ebizSignDTOS: [
+                {
+                  signOrRead: 'tip',
+                  signId: that.appntSign.signId,
+                  orderNo: window.localStorage.getItem('orderNo'),
+                  documentCode: that.appntSign.documentCode,
+                  documentStatus: '3',
+                  documentType: that.appntSign.documentType,
+                  signType: that.signVal,
+                  baseEncryp: that.base64,
+                  tipsPolicyUrl: that.tipsPolicyUrl
+                }
+              ]
+            }
+          }
+
+          saveInformation(data).then(res => {
+            if (res.result == '0') {
+              this.$toast.clear()
+              window.localStorage.setItem('detailJump', '')
+              sessionStorage.twowxSigned = false
+              let doubleRecordFlag = localStorage.doubleRecordFlag
+              let routeUrl = '/sale/signatureOfElectronic'
+              if (doubleRecordFlag == '1') {
+                // 跳转双录签署文件
+                routeUrl = '/sale/avoidDutyTip'
+              }
+              this.$jump({
+                flag: 'h5',
+                extra: {
+                  url: location.origin + '/#' + routeUrl,
+                  forbidSwipeBack: '1'
+                },
+                routerInfo: {
+                  path: routeUrl
+                }
+              })
+            } else {
+              that.$toast(res.resultMessage)
+            }
+          })
+        }
       }
     }
   }