跳转链接修改完成

zhouhao

2022-01-11 e9a40ce57907184ee48d2aab1c3dab4a2e61c7ab

 src/views/main/addBankcard.vue

@@ -3,39 +3,49 @@
  <div class='text-main'>
    <!-- <van-nav-bar  :title="title"  left-arrow  @click-left="onClickLeft" /> -->
    <van-form validate-first ref="credRef">
      <div  class="bes-title"><div> 分销个人</div></div>
      <div class="bes-title">
        <div v-if="bizType==0 || bizType==1 && this.dataInfo.status==0"> 分销个人</div>
         <div v-else> 分销主体</div>
      </div>
      <!-- <van-field v-model.trim="dataForm.bankCardNo" label="银行卡号" placeholder="请输入银行卡号" :rules="bankId" name="bankId" clearable>
        <template #button>
          <van-icon name="scan" size="25" @click="imgClick()" />
        </template>
      </van-field> -->
      <!-- <van-field readonly clickable name="noName" :value="bankName" label="银行名称" placeholder="请选择银行名称" @click="showPicker = true"  :rules="noName"  right-icon="arrow"/> -->
      <div>
      <van-field v-model.trim="dataForm.name"   label="姓名："    readonly/>
      <van-field v-model.trim="dataForm.idNo"  label="身份证号："  readonly/>
      <div v-if="this.bizType==0 && this.dataInfo.status==0 || this.dataInfo.status==0 && this.bizType==1">
        <van-field v-model.trim="dataForm.name" label="姓名：" readonly />
        <van-field v-model.trim="dataForm.idNo" label="身份证号：" readonly />
        <van-field v-model.trim="dataForm.mblNo" label="手机号：" readonly />
      </div>

      <van-field v-model.trim="dataForm.verCode" center clearable label="短信验证码" :rules="codeRules" placeholder="请输入短信验证码" >
      <div v-else>
        <van-field v-model.trim="dataForm.confName" label="企业名称：" readonly />
        <van-field v-model.trim="dataForm.name" label="负责人姓名：" readonly />
        <van-field v-model.trim="dataForm.idNo" label="负责人身份证号：" label-width="140px"   readonly />
        <van-field v-model.trim="dataForm.mblNo" label="负责人手机号："  label-width="140px"   readonly />
      </div>
      <van-field v-model.trim="dataForm.verCode" center clearable label="短信验证码" :rules="codeRules" placeholder="请输入短信验证码">
        <template #button>
          <van-button size="small" color="#6cc3bb" @click.stop="getCode"  native-type="button" :disabled="isdisabled">{{codeText}}</van-button>
          <van-button size="small" color="#6cc3bb" @click.stop="getCode" native-type="button" :disabled="isdisabled">{{codeText}}</van-button>
        </template>
      </van-field>
      <div class="index-title">
        <van-checkbox v-model="checked" style="height:30px; margin-right:5px" checked-color="#6cc3bb"></van-checkbox>
        <div  v-if="bizType==0 && $route.query.types!=1"  style="color:#999999;font-size:12px"> 阅读并同意<span  style="border-bottom:1px solid #00F; color:#00F"  @click="show=true">《信息授权函》</span>的签订</div>
        <div  v-if="bizType==1 && $route.query.types!=1"  style="color:#999999;font-size:12px"> 阅读并同意<span  style="border-bottom:1px solid #00F; color:#00F"  @click="showx=true">《保理付款服务合同》</span>的签订</div>
        <div v-if="bizType==0 && this.dataInfo.status==0" style="color:#999999;font-size:12px"> 阅读并同意<span style="border-bottom:1px solid #00F; color:#00F" @click="contractBtn">《信息授权函》</span>的签订</div>
        <div v-if="bizType==1 && this.dataInfo.status==0" style="color:#999999;font-size:12px"> 阅读并同意<span style="border-bottom:1px solid #00F; color:#00F" @click="contractBtn">《单笔保理融资服务合同》</span>的签订</div>
        <div v-if="bizType==1 && this.dataInfo.status==3" style="color:#999999;font-size:12px"> 阅读并同意<span style="border-bottom:1px solid #00F; color:#00F" @click="contractBtn">《单笔保理融资服务合同》</span>的签订</div>
      </div>
      <div style="margin: 16px;margin-top:30px">
        <van-button round block  color="#6cc3bb" @click="onFailed" native-type="submit">确认</van-button>
        <van-button round block color="#6cc3bb" @click="onFailed" native-type="submit">确认</van-button>
      </div>
    </van-form>
    <van-popup v-model="show">
      <div class="agreenBox">
      <!-- <div class="agreenBox">
        <div class="agreen-html" v-html="agreementext"></div>
        <div class="close-agreen" @click="show = false">
          <van-icon name="close" color="#c8c9cc" />
        </div>
      </div>
      </div> -->
    </van-popup>
    <van-popup v-model="showx">
      <div class="agreenBox">
@@ -45,11 +55,10 @@
        </div>
      </div>
    </van-popup>
   <van-popup v-model="showPicker" position="bottom">
    <van-picker show-toolbar :columns="dataObj.bankList" @confirm="onConfirm" @cancel="showPicker = false" value-key="name" ref="pickerRef"/>
  </van-popup>
    <van-popup v-model="showPicker" position="bottom">
      <van-picker show-toolbar :columns="dataObj.bankList" @confirm="onConfirm" @cancel="showPicker = false" value-key="name" ref="pickerRef" />
    </van-popup>
    <input style="float: left;  display: none;" type="file" id='uploadFile' accept="image/*" v-on:change="readLocalFile()" v-if="ishowFile">
  </div>
  </div>
</template>

@@ -57,8 +66,9 @@
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';

import { repstr } from '../../../static/agreement5'
import { repstr } from '../../../static/agreement1'
import { repstrw } from '../../../static/agreement2'
import { ImagePreview } from 'vant';
export default {
  //import引入的组件需要注入到对象中才能使用
  components: {},
@@ -67,20 +77,22 @@
    return {
      dataForm: {
      },
      dataInfo:{},
      ishowFile:true,
      dataObj :{},
      dataInfo: {},
      ishowFile: true,
      dataObj: {},
      showPicker: false,
      agreementext: '',
      agreementextw: '', //代扣委託書
      agreementext:'',
      agreementextw: repstrw(111,222), //代扣委託書
      checked: false,
      codeValue: '',
      isdisabled: false,
      show: false,
      showx: false,
      bankName:'',
      bizId:this.$route.query.bizId,   //订单编号 
      bizType:this.$route.query.bizType,  //订单类型
      contractUrl:[],//合同预览
      bankName: '',
      showOverlay: false,
      bizId: this.$route.query.bizId,   //订单编号 
      bizType: this.$route.query.bizType,  //订单类型
      codeText: '获取验证码',
      noName: [
        {
@@ -121,7 +133,7 @@
        //   trigger: 'onBlur',
        // },
      ],
       codeRules: [
      codeRules: [
        {
          required: true,
          message: '验证码不能为空',
@@ -144,48 +156,52 @@
  //监控data中的数据变化
  watch: {
    dataForm: {
　　　　handler(newValue, oldValue) {
// 　　　　　if(newValue.bankCardNo==''){
             this.ishowFile = false // 销毁
// }
　　　　},
　　　　deep: true
　　}
      handler(newValue, oldValue) {
        // 　　　　　if(newValue.bankCardNo==''){
        this.ishowFile = false // 销毁
        // }
      },
      deep: true
    }
  },
  //方法集合
  methods: {
    bankCardNoInit() {
        let  objForm ={bizId:this.bizId,bizType:this.bizType}
          this.$api.refreshFaceStatus(objForm).then(res=>{
             this.dataInfo  =res.body
            if (this.dataInfo.status==0){
                this.$api.getFrontData(objForm).then(res=>{
                     this.dataForm  =res.body
                })
            }
      let objForm = { bizId: this.bizId, bizType: this.bizType }
      this.$api.getBizStatus(objForm).then(res => {
        this.dataInfo = res.body
        if (this.dataInfo.status == 0  || Number(this.bizType) == 1 && this.dataInfo.status == 3) {    //待签约状态停留在当前页面
          this.$api.getFrontData(objForm).then(res => {
            this.dataForm = res.body
          })
        }else if(this.dataInfo.status == 3  && Number(this.bizType) ==0 || this.dataInfo.status ==6 && Number(this.bizType) ==1 ){  //跳到合同已完成页面
               this.$router.push({path:'/main/bancardsucces',query:{bizId:this.bizId,bizType:this.bizType}}) 
        }else{   //跳到验证页面
             this.$router.push({ path: '/main/queryres', query: { ...objForm } })
            } 
      })
    },
    onClickLeft(){
     
    onClickLeft() {

    },
   onConfirm(value) {
    onConfirm(value) {
      this.bankName = value.name;
      this.dataForm.bankCode=this.$refs.pickerRef.getValues()[0].code 
      this.dataForm.bankCode = this.$refs.pickerRef.getValues()[0].code
      this.showPicker = false;
    },
    onFailed() {
      let mes  = `请阅读并同意${this.orderType==1?'信息授权函':'保理付款服务合同'}`
       if (!this.checked) return this.$notify(mes)
             let objUrl
            if (process.env.NODE_ENV === "development") {  //开发环境
             objUrl = `https://t.finlean.com/comn_business/#/main/queryres?bizId=${this.bizId}&bizType=${this.bizType}`
            }  else{  //生产
              objUrl = `${window.location.origin}/comn_business/#/main/queryres?bizId=${this.bizId}&bizType=${this.bizType}`
            }
            const objForm ={bizId:this.bizId,bizType:this.bizType,callbackUrl:objUrl}
             this.$api.getFaceUrl(objForm).then(res=>{
                 window.location.href=res.body.faceUrl
             })
      let mes = `请阅读并同意${this.orderType == 1 ? '信息授权函' : '保理付款服务合同'}`
      if (!this.checked) return this.$notify(mes)
      let objUrl
      if (process.env.NODE_ENV === "development") {  //开发环境
        objUrl = `https://t.finlean.com/comn_business/#/main/queryres?bizId=${this.bizId}&bizType=${this.bizType}`
      } else {  //生产
        objUrl = `${window.location.origin}/comn_business/#/main/queryres?bizId=${this.bizId}&bizType=${this.bizType}`
      }
      const objForm = { bizId: this.bizId, bizType: this.bizType, callbackUrl: objUrl,verCode:this.dataForm.verCode }
      this.$api.getFaceUrl(objForm).then(res => {
        window.location.href = res.body.faceUrl
      })
      // this.$refs.credRef.validate().then(() => {
      //   // 验证通过
      //   if (this.dataForm.verCode ==undefined || this.dataForm.verCode =='') return this.$notify('请输入验证码')
@@ -195,12 +211,12 @@
      //   })
      // })
    },
      getCode(e) {
 
      this.$refs.credRef.validate(['bankId','noName']).then(()=>{         
          this.getVerificationCode()                            
    getCode(e) {

      this.$refs.credRef.validate(['bankId', 'noName']).then(() => {
        this.getVerificationCode()
      })
 

    },
    setTime: function () {
      let time = 60
@@ -230,47 +246,63 @@
    },
    getVerificationCode: function () {
      // 向服务器获取验证码        
       
         this.$api.bankCardAuthMsg({...this.dataForm, orderId: this.orderId}).then(res => {
       this.agreementextw = repstrw(this.dataObj.userName,this.dataObj.idNo,this.dataForm.bankCardMblNo,this.bankName,this.dataForm.bankCardNo);

      this.$api.sendVerifyCode({bizId: this.bizId, bizType: this.bizType}).then(res => {
        // this.agreementextw = repstrw(this.dataObj.userName, this.dataObj.idNo, this.dataForm.bankCardMblNo, this.bankName, this.dataForm.bankCardNo);
        this.$notify_success('验证码发送成功！')
        this.setTime()
      })
    },
    contractBtn(){  //查看合同
    let objUrl=''
     if (process.env.NODE_ENV === "development") {  //开发环境
             objUrl = `https://t.finlean.com`
      }  else{  //生产
          objUrl = `${window.location.origin}`
    }
     this.contractUrl=[]
       this.$api.getContInfo({bizId: this.bizId, bizType: this.bizType}).then(res=>{
         this.contractUrl =res.body.contractUrl.map(element => { 
         return element  = objUrl+element
      })
            ImagePreview(this.contractUrl);
       })
    
    },
    //图片click
    imgClick: function () {
        this.ishowFile = true // 重建
      this.$nextTick(()=>{
               document.getElementById("uploadFile").click();
      this.ishowFile = true // 重建
      this.$nextTick(() => {
        document.getElementById("uploadFile").click();
      })
    // 
      // 
    },
    //点击选中图片
    readLocalFile: function () {
      console.log(document.getElementById("uploadFile").files)
              this.ishowFile = false // 销毁
      this.ishowFile = false // 销毁
      var localFile = document.getElementById("uploadFile").files[0];
      var reader = new FileReader();
      var content;
      var self = this;
      reader.onload = function (event) {
        content = event.target.result;
       self.compress(content, 800, 0.5).then(val => {
       val =  val.substring(val.indexOf(',')+1)
           self.$api.bankCardOcr({base64Img:val}).then(res=>{
           self.dataForm.bankCardNo =res.body.bankCardNo
               
       })
      });
        self.compress(content, 800, 0.5).then(val => {
          val = val.substring(val.indexOf(',') + 1)
          self.$api.bankCardOcr({ base64Img: val }).then(res => {
            self.dataForm.bankCardNo = res.body.bankCardNo

          })
        });
        // current.imgs.push(content);  //获取图片base64代码
      }
      reader.onerror = function (event) {
        alert('error')
      }
      content = reader.readAsDataURL(localFile, "UTF-8");
           this.ishowFile = true // 重建
      this.ishowFile = true // 重建
    },
  // 压缩图片
    // 压缩图片
    compress(base64String, w, quality) {
      var newImage = new Image();
      var imgWidth, imgHeight;
@@ -304,8 +336,14 @@
  },
  //生命周期 - 创建完成（可以访问当前this实例）
  created() {
    console.log(process.env.NODE_ENV )
    this.bankCardNoInit()
    if (!this.$route.query.bizId || !this.$route.query.bizType) return this.$toast({
        message: '请通过有效连接访问！',
        type:'fail',
        duration:0,
        overlay:true,
      })
     this.setTime()
     this.bankCardNoInit()
  },
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {
@@ -337,12 +375,12 @@
    color: #999999;
    font-size: 12px;
  }
  .bes-title{
  .bes-title {
    background-color: #fff;
    font-size: 20px;
    font-weight: bold;
    height: 60px;
    div{
    div {
      margin-left: 16px;
      line-height: 60px;
    }