银保代理人电子化合同签署补全基本功能代码逻辑

src/views/ebiz/YB_agentSign/step1.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="text-center" style="height: 100vh;background: #fff;">
+  <div style="height: 100vh;background: #fff;">
     <div style="display: flex;align-items: center;justify-content: center;padding-top: 60px;">
       <img style="width: 40px;" src="@/assets/images/logo.png" />
       <span style="margin-left: 15px;">请您填写以下正确信息</span>
@@ -11,7 +11,7 @@
       </van-cell-group>
     </div>
     <van-button type="danger" class="bottom-btn" @click="nextStep" v-no-more-click="1000">确定</van-button>
-    <van-dialog v-model="isCaptchaModalShow" title="请输入验证码" :before-close="onCaptchaConfirm">
+    <van-dialog class="text-center" v-model="isCaptchaModalShow" title="请输入验证码" :before-close="onCaptchaConfirm">
       <div style="margin-top: 20px;margin-bottom: 20px;">
         <van-field v-model="mobile" label="手机号码" />
         <van-field v-model="code" type="number" :maxlength="6" center clearable label="短信验证码" placeholder="请输入短信验证码">
@@ -46,7 +46,7 @@ export default {
     }
   },
   mounted() {
-
+    this.mobile = this.dataMaskingMobile(this.mobile)
   },
   methods: {
     nextStep(){
@@ -88,6 +88,15 @@ export default {
     onCaptchaConfirm(){
       console.log('123')
       this.isCaptchaModalShow = false
+    },
+    dataMaskingMobile(mobile) {
+      let str = ''
+      if (mobile && mobile.trim().length == 11) {
+        str = mobile.trim().replace(/^(\S{0})(\S*)(\S{4})$/, function(all, u1, u2, u3) {
+          return u1 + new Array(u2.length + 1).join('*') + u3
+        })
+      }
+      return str
     }
   },
   filters: {
@@ -102,9 +111,9 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-/deep/ .van-cell{
+  /deep/ .van-cell{
-  padding: 18px 15px;
+    padding: 18px 15px;
-}
+  }
   /deep/.van-dialog__confirm{
     color: #fff!important;
     background: #e9332e;
@@ -112,4 +121,13 @@ export default {
     margin-bottom: 20px;
     width: 80%;
   }
+  /deep/.van-field__label{
+    margin-left: 15px;
+  }
+  .text-center{
+    /deep/.van-field__label{
+      margin-left: 15px;
+      text-align: left;
+    }
+  }
 </style>

src/views/ebiz/YB_agentSign/step2.vue

@@ -6,17 +6,14 @@
     <iframe :src='src + pdfUrl' class='iframe'></iframe>
     <van-radio-group v-model='radio' class='pb10 pt20 pl30 fs14'>
       <van-radio name='1' @click='click'>
-        本人确认已阅读
+        本人确认已阅读<span>《电子化合同签署》</span>
-        <span>《电子化合同签署》</span>
       </van-radio>
     </van-radio-group>
     <div class='pt30 pl30 flex align-items-c'>
       <span class='mr10'>投保人签名 :</span>
-      <div v-if="signVal == '0' || signVal == '2'">
+      <van-button type='danger' size='small' :disabled="signStatus == '1' ? true : isDisable" @click="sign" v-no-more-click='1000'>
-        <van-button type='danger' size='small' :disabled="signVal == '1' ? true : isDisable" @click="sign('0')" v-no-more-click='1000'>
+        {{signStatus == '2' ? '签名' : '已签名' }}
-          {{appntSign.documentStatus == '2' ? '签名' : '已签名' }}
+      </van-button>
-        </van-button>
-      </div>
     </div>
     <div class='bg-white bottom-btn'>
       <van-button type='danger' size='large' :disabled='isDisabledComplite' @click='goNext' v-no-more-click='1000'>提交
@@ -36,6 +33,9 @@
         number: '',
         src: location.origin + '/pdfjs/web/viewer.html?file=',
         pdfUrl: '',
+        signStatus: '',
+        isDisable: true,
+        isDisabledComplite:true,
       }
     },
     components: {
@@ -82,6 +82,39 @@
           that.number = `${time}`
         }, 1000)
       },
+      sign() {
+        this.$toast.loading({
+          duration: 0, // 持续展示 toast
+          forbidClick: true, // 禁用背景点击
+          loadingType: 'spinner',
+          message: '加载中……'
+        })
+        EWebBridge.webCallAppInJs('ca_sign', {
+          //身份证号码
+          number: this.saleInsuredInfo.idNo,
+          //姓名
+          name: this.saleInsuredInfo.name,
+          type: this.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') {
+            this.base64 = decodeURI(JSON.parse(data).sign)
+            this.appntSign.documentStatus = '3'
+            this.isDisabledComplite = false
+            this.isSign = false
+          }
+        })
+      },
+      goNext(){
+
+      }
     },
     computed: {