更新为3.29

李

2 days ago 584860d11b454774b60c71b63d221b5481c0f3bd

 src/page/authentication/index.vue

@@ -1,34 +1,20 @@
<template>
  <div class="authentication-container">
    <van-nav-bar
      :placeholder="true"
      :safe-area-inset-top="true"
      :title="$t('rnv')"
      left-arrow
      @click-left="$router.go(-1)"
    >
    <van-nav-bar :placeholder="true" :safe-area-inset-top="true" :title="$t('rnv')" left-arrow
      @click-left="$router.go(-1)">
    </van-nav-bar>

    <div style="width: 100%; height: .25em; background-color: #f8f8f8"></div>

    <div class="form-group" :class="{ disabled: isSubmitting || isActive }">
      <label class="required-label">{{ $t("hj195") }}</label>
      <input
        type="text"
        v-model="form.realName"
        class="form-input"
        :disabled="isActive"
      />
      <input type="text" v-model="form.realName" class="form-input" :disabled="isActive" />
    </div>

    <div class="form-group" :class="{ disabled: isSubmitting || isActive }">
      <label class="required-label">{{ $t("it1") }}</label>
      <van-radio-group
        v-model="form.realType"
        direction="horizontal"
        :disabled="isActive"
        style="font-size: 3.5vw;margin-top: 1em;"
      >
      <van-radio-group v-model="form.realType" direction="horizontal" :disabled="isActive"
        style="font-size: 3.5vw;margin-top: 1em;">
        <van-radio :name="1">{{ $t("dl1") }}</van-radio>
        <van-radio :name="2">{{ $t("pa1") }}</van-radio>
        <van-radio :name="3">{{ $t("身份證件") }}</van-radio>
@@ -37,90 +23,49 @@

    <div class="form-group" :class="{ disabled: isSubmitting || isActive }">
      <label class="required-label">{{ $t("in1") }}</label>
      <input
        type="text"
        v-model="form.idCard"
        class="form-input"
        :disabled="isActive"
      />
      <input type="text" v-model="form.idCard" class="form-input" :disabled="isActive" />
    </div>

    <div class="form-group" :class="{ disabled: isSubmitting || isActive }">
      <label class="required-label">{{ $t("电话号码") }}</label>
      <input
        type="text"
        v-model="form.vaildNumber"
        class="form-input"
        :disabled="isActive"
      />
      <input type="text" v-model="form.vaildNumber" class="form-input" :disabled="isActive" />
    </div>

    <div style="width: 100%; height: .25em; background-color: #f8f8f8"></div>

    <div
      class="form-group flex-between"
      :class="{ disabled: isSubmitting || isActive }"
    >
    <div class="form-group flex-between" :class="{ disabled: isSubmitting || isActive }">
      <label class="required-label">{{ $t("fsi1") }}</label>

      <el-upload
        :with-credentials="true"
        class="avatar-uploader"
        :action="admin + 'user/upload.do'"
        list-type="picture-card"
        name="upload_file"
        :show-file-list="false"
        :on-success="handleAvatarSuccess"
        :on-error="handleError"
        :before-upload="beforeAvatarUpload"
        :disabled="isActive"
      >
        <img
          v-if="form.img1key"
          :src="form.img1key"
          class="id-img avatar"
          style="width: 100%; height: 100%"
        />
      <el-upload :with-credentials="true" class="avatar-uploader" :action="admin + 'user/upload.do'"
        list-type="picture-card" name="upload_file" :show-file-list="false" :on-success="handleAvatarSuccess"
        :on-error="handleError" :before-upload="beforeAvatarUpload" :disabled="isActive">
        <img v-if="form.img1key" :src="form.img1key" class="id-img avatar" style="width: 100%; height: 100%" />
        <i v-else class="iconfont icon-zhaopian"></i>
      </el-upload>
    </div>

    <div
      class="form-group flex-between"
      :class="{ disabled: isSubmitting || isActive }"
    >
    <div class="form-group flex-between" :class="{ disabled: isSubmitting || isActive }">
      <label class="required-label">{{ $t("bsi1") }}</label>

      <el-upload
        :with-credentials="true"
        class="avatar-uploader"
        :action="admin + 'user/upload.do'"
        list-type="picture-card"
        name="upload_file"
        :show-file-list="false"
        :on-success="handleAvatarSuccess2"
        :on-error="handleError2"
        :before-upload="beforeAvatarUpload2"
        :disabled="isActive"
      >
        <img
          v-if="form.img2key"
          :src="form.img2key"
          class="id-img avatar"
          style="width: 100%; height: 100%"
        />
      <el-upload :with-credentials="true" class="avatar-uploader" :action="admin + 'user/upload.do'"
        list-type="picture-card" name="upload_file" :show-file-list="false" :on-success="handleAvatarSuccess2"
        :on-error="handleError2" :before-upload="beforeAvatarUpload2" :disabled="isActive">
        <img v-if="form.img2key" :src="form.img2key" class="id-img avatar" style="width: 100%; height: 100%" />
        <i v-else class="iconfont icon-zhaopian"></i>
      </el-upload>
    </div>

    <div style="width: 100%; height: .25em; background-color: #f8f8f8"></div>

    <div
      class="submit-button"
      :class="{ disabled: isSubmitting || isActive }"
      @click="toSure"
    >
      <span>{{ $t("hj161") }}</span>
    <div class="submit-button" :class="{ disabled: isSubmitting || isActive }" @click="toSure">
      <span>{{ submitButtonLabel }}</span>
    </div>

    <div class="auth-status-wrap" v-if="authRejectReason">
      <div class="auth-reject-reason">
        <div class="reason-label">{{ $t("hj201") }}</div>
        <div class="reason-text">{{ authRejectReason }}</div>
      </div>
    </div>
  </div>
</template>
@@ -151,13 +96,38 @@
    };
  },
  computed: {
    //注册默认0  1.提交未实名 2.已实名 3.驳回, 状态1||2的时候屏蔽所有的输入
    // 注册默认0  1.审核中 2.已实名 3.驳回；状态1||2时屏蔽所有输入
    isActive() {
      return (
        this.$store.state.userInfo.isActive == 1 ||
        this.$store.state.userInfo.isActive == 2
      );
      // return false;
    },
    authStatusCode() {
      const u = this.$store.state.userInfo;
      if (
        !u ||
        u.isActive === undefined ||
        u.isActive === null ||
        u.isActive === ""
      ) {
        return 0;
      }
      const n = Number(u.isActive);
      return Number.isNaN(n) ? 0 : n;
    },
    authRejectReason() {
      if (this.authStatusCode !== 3) return "";
      const msg =
        this.$store.state.userInfo && this.$store.state.userInfo.authMsg;
      return msg ? String(msg) : "";
    },
    /** 状态 1/2 时替换提交按钮文案，其余仍为「确定」 */
    submitButtonLabel() {
      const c = this.authStatusCode;
      if (c === 1) return this.$t("auth_submit_certifying");
      if (c === 2) return this.$t("auth_submit_certified_done");
      return this.$t("hj161");
    }
  },
  created() {
@@ -171,7 +141,7 @@
    toSure() {
      if (this.isSubmitting || this.isActive) return; // 防止重复提交
      // 实名认证弹框
      if (isNull(this.form.name)) {
      if (isNull(this.form.realName)) {
        Toast(this.$t("hj207"));
      } else if (isNull(this.form.idCard)) {
        Toast(this.$t("hj208"));
@@ -247,7 +217,7 @@
        return false;
      } else {
        this.form.img2key = URL.createObjectURL(file);
        compress(file, function(val) {});
        compress(file, function (val) { });
      }
    },
    handleError2() {
@@ -258,7 +228,7 @@
</script>

<style lang="less" scoped>
@green: #c4d600;
@green: #00f0ff;

/deep/ .van-nav-bar__content {
  height: 65px;
@@ -426,4 +396,62 @@
.disabled {
  opacity: 0.5;
}

.auth-status-wrap {
  margin: 1em 0.25em 1.2em;
  padding: 0.35em 0.3em 0.45em;
  background: #f7f8fa;
  border-radius: 8px;
  border: 1px solid #e8e8e8;
  font-size: 16px;
}

.auth-status-title {
  color: #666;
  font-size: 14px;
  margin-bottom: 0.35em;
  font-weight: 600;
}

.auth-status-value {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.45;
  word-break: break-word;
}

.auth-status-none {
  color: #999;
}

.auth-status-pending {
  color: #d48806;
}

.auth-status-approved {
  color: #389e0d;
}

.auth-status-rejected {
  color: #cf1322;
}

.auth-reject-reason {
  margin-top: 0.45em;
  padding-top: 0.35em;
  border-top: 1px dashed #e0e0e0;
}

.auth-reject-reason .reason-label {
  color: #666;
  font-size: 13px;
  margin-bottom: 0.2em;
}

.auth-reject-reason .reason-text {
  color: #333;
  font-size: 14px;
  line-height: 1.5;
  word-break: break-word;
}
</style>