HomeLease/pages/realNameAuthentication/realNameAuthentication.vue

<template>
  <view class="page">
    <custom-nav-bar :fill="false" :show-back="true" background-color="transparent" title="" />
    <image class="bj" mode="" src="https://api.ccttiot.com/image-1757389708427.png"></image>
    <view v-if="!isReal" class="sfxx">
      <view class="tit"> 请输入您的有效身份信息</view>
      <view class="name"> 姓名 <input v-model="name" placeholder="请填写姓名" type="text" /></view>
      <view class="name">
        身份证号 <input v-model="zfzh" placeholder="请填写身份证号" type="text" />
      </view>
      <view class="" style="width: 100%; text-align: center; margin-top: 20rpx; color: #ccc">
        您当前还未完成实名认证
      </view>
    </view>
    <view v-else class="sfxx">
      <view class="tit"> 请输入您的有效身份信息</view>
      <view class="name">
        姓名 <input v-model="name" :disabled="true" placeholder="请填写姓名" type="text" />
      </view>
      <view class="name">
        身份证号 <input v-model="zfzh" :disabled="true" placeholder="请填写身份证号" type="text" />
      </view>
      <view class="" style="width: 100%; text-align: center; margin-top: 20rpx; color: #ccc">
        您当前已完成实名认证
      </view>
    </view>
    <view v-if="!isReal" class="anniu" @click="btnshiming">
      <!-- <text>进入人脸识别</text> -->
      <text>提交</text>
    </view>
  </view>
</template>

<script>
import {
  putRealName,
  refreshRealName,
} from '../../api/realNameAuthentication/realNameAuthentication'

export default {
  data() {
    return {
      isReal: false,
      bgc: {
        backgroundColor: '',
      },
      name: '',
      zfzh: '',

      backData: null,
      smflag: true,
    }
  },
  onLoad(option) {
    if (option.isReal) {
      console.log('路由传入的实名', option.isReal)
      this.isReal = option.isReal
      console.log('vue挂载的实名', this.isReal)
    }
  },
  onShow() {
    // if (this.backData === true) {
    //    console.log('接收数据:', this.backData);
    //    this.getshuaxin();
    //    this.backData = null; // 重置
    //  }
  },
  methods: {
    // 刷新人脸识别是否成功
    getshuaxin() {
      refreshRealName().then(res => {
        if (res.code === 200) {
          if (res.data.pass === true) {
            let realNameType = res.data.realNameType
            let infoId = res.data.infoId
            uni.showModal({
              title: '温馨提示',
              content: `人脸认证成功`,
              showCancel: false,
              success: function (res) {
                uni.navigateBack()
              },
            })
          } else {
            uni.showModal({
              title: '温馨提示',
              content: `人脸认证失败`,
              showCancel: false,
              success: function (res) {
                uni.navigateBack()
              },
            })
          }
        } else {
          uni.showModal({
            title: '温馨提示',
            content: `人脸认证失败`,
            showCancel: false,
            success: function (res) {
              uni.navigateBack()
            },
          })
        }
      })
    },

    // 点击进行实名认证
    btnshiming() {
      if (this.smflag === true) {
        this.smflag = false
        let data = {
          userName: this.name,
          idCard: this.zfzh,
        }
        console.log('<UNK>', data)
        putRealName(data).then(res => {
          if (res.code === 200) {
            let https = encodeURIComponent(res.data.jumpUrl)
            this.backData = true
            uni.navigateTo({
              url: '/page_user/facialRecognition/facialRecognition?https=' + https,
            })
          } else if (res.code === 500 && res.msg === null) {
            uni.showToast({
              title: '已提交，请等待系统反馈',
              icon: 'none',
              duration: 2000,
            })
            this.smflag = true
          } else {
            uni.showToast({
              title: res.msg,
              icon: 'none',
              duration: 2000,
            })
            this.smflag = true
          }
        })
      }

      // this.$u.put(`/app/realName/realName`,data).then(res =>{ //人脸
      // 	if(res.code === 200){
      // 		let https = encodeURIComponent(res.data.jumpUrl)
      // 		this.backData = true
      // 		uni.navigateTo({
      // 			url:'/page_fenbao/renlian?https=' + https
      // 		})
      // 	}else{
      // 		uni.showToast({
      // 			title: res.msg,
      // 			icon: 'none',
      // 			duration: 2000
      // 		})
      // 	}
      // })
    },
  },
}
</script>

<style lang="scss">
.anniu {
  width: 750rpx;
  height: 174rpx;
  background: #ffffff;
  box-shadow: 0rpx 8rpx 20rpx 0rpx rgba(0, 0, 0, 0.3);
  border-radius: 0rpx 0rpx 0rpx 0rpx;
  line-height: 174rpx;
  text-align: center;
  position: fixed;
  left: 0;
  bottom: 0;

  text {
    display: inline-block;
    width: 682rpx;
    height: 84rpx;
    background: #f15a04;
    border-radius: 42rpx 42rpx 42rpx 42rpx;
    text-align: center;
    line-height: 84rpx;
    font-weight: 600;
    font-size: 36rpx;
    color: #ffffff;
  }
}

.sfxx {
  width: 676rpx;
  height: 480rpx;
  background: #ffffff;
  border-radius: 20rpx 20rpx 20rpx 20rpx;
  margin: auto;
  margin-top: 460rpx;
  border-radius: 30rpx;

  .name {
    width: 624rpx;
    height: 92rpx;
    margin: auto;
    background: #efefef;
    border-radius: 46rpx 46rpx 46rpx 46rpx;
    margin-top: 46rpx;
    display: flex;
    align-items: center;
    font-size: 32rpx;
    color: #3d3d3d;
    padding-left: 40rpx;
    box-sizing: border-box;
    justify-content: space-between;

    input {
      width: 430rpx;
      padding-right: 20rpx;
      box-sizing: border-box;
    }
  }

  .tit {
    width: 676rpx;
    height: 118rpx;
    background: #efefef;
    font-weight: 600;
    font-size: 36rpx;
    color: #3d3d3d;
    line-height: 118rpx;
    padding-left: 38rpx;
    box-sizing: border-box;
    border-radius: 30rpx 30rpx 0 0;
  }
}

.bj {
  width: 750rpx;
  height: 696rpx;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}
</style>