1

jhzh

2026-03-06 8e02bd10547b33e0ad115764474166bf1cccce7a

 src/page/authentication/index.vue

@@ -1,14 +1,22 @@
<template>
  <div class="bank_card_page">
    <van-nav-bar
      :placeholder="true"
      :safe-area-inset-top="true"
      title="KYC"
      left-arrow
      @click-left="$router.go(-1)"
    >
    </van-nav-bar>
    <div class="content">
      <div class="top_back">
<!--      <div class="top_back">
        <div class="left_back_icon" @click="$router.go(-1)">
          <img src="../../assets/img/zuojiantou.png" alt />
        </div>
      </div>
      <div class="titles">
      </div> -->
     <!-- <div class="titles">
        <span>{{ $t("hj146") }}</span>
      </div>
      </div> -->
      <div class="bank_name">
        <div class="lefts">
          <span>{{ $t("hj195") + ":" }}</span>
@@ -32,21 +40,21 @@
          <input
            v-if="showBtn"
            type="text"
            placeholder="Please enter your ID card"
            placeholder="Please enter your Aadhaar card"
            v-model="form.idCard"
          />
          <input v-if="!showBtn" type="text" v-model="form.idCard" readonly />
        </div>
      </div>
      <!-- <div class="bank_name">
      <div class="bank_name">
        <div class="lefts">
          <span>{{ "Vaild Number" + ":" }}</span>
          <span>{{ $t("电话号码") + ":" }}</span>
        </div>
        <div class="rights">
          <input
            v-if="showBtn"
            type="text"
            placeholder="Please enter your ID card"
            placeholder="Please enter your telephone number"
            v-model="form.vaildNumber"
          />
          <input
@@ -56,13 +64,13 @@
            readonly
          />
        </div>
      </div> -->
      </div>
      <div class="uploads">
        <div class="lefts">
          <el-upload
            :with-credentials="true"
            class="avatar-uploader"
            :action="admin + '/user/upload.do'"
            :action="admin + 'user/upload.do'"
            list-type="picture-card"
            name="upload_file"
            :show-file-list="false"
@@ -88,7 +96,7 @@
          <el-upload
            :with-credentials="true"
            class="avatar-uploader"
            :action="admin + '/user/upload.do'"
            :action="admin + 'user/upload.do'"
            list-type="picture-card"
            name="upload_file"
            :show-file-list="false"
@@ -179,6 +187,7 @@
      imgStatus: false,
      imgStatus2: false,
      messFlag: this.$store.state.userInfo.isActive == 3 ? true : false,
      tempImg2Url: null, // Store temporary image URL for cleanup
    };
  },
  created() {
@@ -186,6 +195,10 @@
  },

  beforeDestroy() {
    // Clean up temporary image URLs to avoid memory leaks
    if (this.tempImg2Url) {
      URL.revokeObjectURL(this.tempImg2Url);
    }
    if (this.$state.theme == "red") {
      document.body.classList.remove("red-bg");
      document.body.classList.add("black-bg");
@@ -200,17 +213,44 @@
  methods: {
    handleAvatarSuccess(res, file) {
      this.imgStatus = false;
      this.form.img1key = res.data.url;
      // Ensure using network URL instead of temporary URL
      if (res && res.data && res.data.url) {
        this.form.img1key = res.data.url;
      } else {
        console.error('Upload response data format error:', res);
        Toast(this.$t("hj209") || "Upload failed");
      }
    },
    beforeAvatarUpload(file) {
      this.imgStatus = true;
    },
    handleError() {
      this.imgStatus = false;
      // Ensure temporary URL is not retained on upload failure
      if (this.form.img1key && this.form.img1key.startsWith('blob:')) {
        URL.revokeObjectURL(this.form.img1key);
        this.form.img1key = '';
      }
    },
    handleAvatarSuccess2(res, file) {
      this.imgStatus2 = false;
      this.form.img2key = res.data.url; // URL.createObjectURL(file.raw);
      // Clean up temporary URL if exists
      if (this.tempImg2Url) {
        URL.revokeObjectURL(this.tempImg2Url);
        this.tempImg2Url = null;
      }
      // Ensure using network URL instead of temporary URL
      if (res && res.data && res.data.url) {
        this.form.img2key = res.data.url;
      } else {
        console.error('Upload response data format error:', res);
        Toast(this.$t("hj209") || "Upload failed");
        // Clear temporary URL on upload failure
        if (this.form.img2key && this.form.img2key.startsWith('blob:')) {
          URL.revokeObjectURL(this.form.img2key);
          this.form.img2key = '';
        }
      }
    },
    beforeAvatarUpload2(file) {
      this.imgStatus2 = true;
@@ -218,22 +258,36 @@
      if (!isLt10M) {
        this.$message.error(this.$t("hj205"));
        return false;
      } else {
        this.form.img2key = URL.createObjectURL(file);
      }
      // Don't set form.img2key here to avoid submitting temporary URL
      // Use a separate preview variable if preview is needed on UI
      // Only create temporary URL for compression if needed
      if (compress) {
        compress(file, function (val) {});
      }
      return true;
    },
    handleError2() {
      this.imgStatus2 = false;
      // Clean up temporary URL on upload failure
      if (this.tempImg2Url) {
        URL.revokeObjectURL(this.tempImg2Url);
        this.tempImg2Url = null;
      }
      // Clear temporary URL if form.img2key is a temporary URL
      if (this.form.img2key && this.form.img2key.startsWith('blob:')) {
        URL.revokeObjectURL(this.form.img2key);
        this.form.img2key = '';
      }
    },
    handleAvatarSuccess3(res, file) {
      this.form.img3key = res.data.url; // URL.createObjectURL(file.raw);
    },
    async getUserInfo() {
      // 获取用户信息
      // Get user information
      let data = await api.getUserInfodata();
      if (data.status === 0) {
        // 判断是否登录
        // Check if logged in
        this.$store.commit("dialogVisible", false);
        this.$store.state.userInfo = data.data;
        this.userInfo = data.data;
@@ -250,12 +304,12 @@
        }
      } else {
        //this.$store.commit('dialogVisible',true);
        //跳转到login
        //Redirect to login
        this.$router.push({ path: "/login" });
      }
    },
    beforeAvatarUpload3(file) {},
    // 上传
    // Upload
    handleFile: function (e) {
      // var that = this
      let $target = e.target || e.srcElement;
@@ -278,7 +332,7 @@
      }
    },
    toSure() {
      // 实名认证弹框
      // Real name authentication dialog
      if (isNull(this.form.name)) {
        Toast(this.$t("hj207"));
      } else if (isNull(this.form.idCard)) {
@@ -288,7 +342,25 @@
      } else if (!this.form.img2key) {
        Toast(this.$t("hj209"));
      } else {
        // 显示确认弹窗
        // Verify if image URL is a temporary URL
        if (this.form.img1key && this.form.img1key.startsWith('blob:')) {
          Toast(this.$t("hj209") || "Image 1 is still uploading");
          return;
        }
        if (this.form.img2key && this.form.img2key.startsWith('blob:')) {
          Toast(this.$t("hj209") || "Image 2 is still uploading");
          return;
        }
        // Ensure image URL is a network URL (http:// or https://)
        if (this.form.img1key && !this.form.img1key.startsWith('http')) {
          Toast(this.$t("hj209") || "Image 1 URL is invalid");
          return;
        }
        if (this.form.img2key && !this.form.img2key.startsWith('http')) {
          Toast(this.$t("hj209") || "Image 2 URL is invalid");
          return;
        }
        // Show confirmation dialog
        this.toAuthentication();
      }
    },
@@ -317,15 +389,30 @@
</script>

<style scoped lang="less">
  /deep/ .van-nav-bar__content {
    height: 65px;
  }
  /deep/ .van-nav-bar__title {
    font-family: "DINPro";
    width: 100%;
    height: 1.17333rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-style: normal;
    font-weight: 500;
    font-size: 0.48rem;
    color: #14181f;
  }
.bank_card_page {
  width: 100%;
  // height: 100%;
  height: 100%;
  background: #fff;
  position: relative;

  .content {
    width: 100%;
    height: 100%;
    height: 100vh;
    padding: 0 0.6rem;

    .top_back {
@@ -422,7 +509,7 @@
/deep/ .el-upload--picture-card {
  background: none;
  width: 100%;
  height: 1.6rem;
  height: 100PX;
  line-height: 1.6rem;
}