银保代理人电子化合同签署 增加页面

src/views/ebiz/YB_agentSign/step2.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class='insuranceInformation-container pb50 redRadioCheckbox'>
+    <van-notice-bar :scrollable='false' v-if='!Time' class='notice'>
+      {{ `提示：阅读时长需在${this.Time ? this.time : this.number}秒以上` }}
+    </van-notice-bar>
+    <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>
+      </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="signVal == '1' ? true : isDisable" @click="sign('0')" v-no-more-click='1000'>
+          {{appntSign.documentStatus == '2' ? '签名' : '已签名' }}
+        </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'>提交
+      </van-button>
+    </div>
+  </div>
+</template>
+<script>
+  import { RadioGroup, Radio, Dialog, NoticeBar } from 'vant'
+  import config from '@/config'
+  export default {
+    data() {
+      let isWeixin = this.$utils.device().isWeixin //判断环境
+      return {
+        time:'10',
+        radio: '',
+        number: '',
+        src: location.origin + '/pdfjs/web/viewer.html?file=',
+        pdfUrl: '',
+      }
+    },
+    components: {
+      [RadioGroup.name]: RadioGroup,
+      [Radio.name]: Radio,
+      [Dialog.name]: Dialog,
+      [NoticeBar.name]: NoticeBar
+    },
+    created(){
+      this.timeOut()
+    },
+    mounted() {
+      document.body.style.backgroundColor = '#fff'
+    },
+    methods: {
+      // 点击阅读时
+      click() {
+        let that = this
+        if (that.isOver == false) {
+          Dialog.confirm({
+            title: '提示',
+            message: '该内容涉及您的重大权益，请您仔细阅读',
+            showCancelButton: false
+          }).then(() => {
+            that.radio = ''
+          })
+        }
+      },
+      timeOut() {
+        let that = this
+        let time = that.time
+        that.Time = false
+        that.number = `${time}`
+        let timer = setInterval(() => {
+          time--
+          if (time <= 0) {
+            time = 0
+            clearInterval(timer)
+
+            that.Time = true
+            that.isOver = true
+            // window.localStorage.setItem('step', '1')
+          }
+          that.number = `${time}`
+        }, 1000)
+      },
+    },
+    computed: {
+
+    },
+    watch: {
+
+    },
+
+    beforeRouteLeave(to, from, next) {
+      document.body.style.backgroundColor = ''
+      next()
+    }
+  }
+</script>
+<style lang='scss' scoped>
+  img {
+    width: 100%;
+    height: 100%;
+  }
+
+  .notice {
+    width: 100%;
+    position: fixed;
+    top: 0;
+    z-index: 20;
+  }
+
+  .iframe {
+    width: 100vw;
+    height: 70vh;
+  }
+</style>