123
dcc
2024-06-28 25b2ba1cf86bc3439e7ad2acf2cd4a9ea7e4b0ed
src/page/certificationCenter/advancedCtf.vue
@@ -1,131 +1,189 @@
<template>
    <div class="advancedCtf">
        <assets-head :title="$t('公证认证')"></assets-head>
        <div class="flex items-center justify-center pt-46 pb-60" v-if="status!=0">
            <img :src="require(`../../assets/image/certificationCenter/advStatus${status}.png`)" alt="" class="w-36 h-36" />
            <span class="ml-16 font-32 textColor">{{fixState(status)}}</span>
        </div>
        <div class="px-32">
            <ExInput :label="$t('真实姓名')"  :disabled="true" :clearBtn="false"  :placeholderText="$t('请输入真实姓名')" v-model="name" />
            <ExInput :label="$t('工作地址')"  :disabled="disabled()" :clearBtn="!disabled()"  :placeholderText="$t('请输入您的工作地址(必填)')" v-model="address" />
            <ExInput :label="$t('家庭地址')"  :disabled="disabled()" :clearBtn="!disabled()" :placeholderText="$t('请输入您的家庭地址(必填)')" v-model="familyAddress" />
        </div>
        <div class="diviLine h-16 mb-48"></div>
        <div class="px-32">
            <ExInput :label="$t('与本人关系')" :disabled="disabled()" :clearBtn="!disabled()" :placeholderText="$t('与本人关系(必填)')" v-model="relationMy" />
            <ExInput :label="$t('亲属姓名')" :disabled="disabled()" :clearBtn="!disabled()" :placeholderText="$t('请输入亲属姓名(必填)')" v-model="relativesName" />
            <ExInput :label="$t('亲属地址')" :disabled="disabled()" :clearBtn="!disabled()"  :placeholderText="$t('请输入亲属地址(必填)')" v-model="relativesAddress" />
            <ExInput :label="$t('亲属电话')" :disabled="disabled()" :clearBtn="!disabled()" :placeholderText="$t('请输入亲属电话(必填)')" v-model="relativesPhone" />
            <div class="btnMain text-black font-34 py-26 rounded-lg text-center mt-60" @click="submit" v-if="status==0 || status==3">
                <span v-if="status==0 ">{{$t('申请认证')}}</span>
                <span v-if="status==3 ">{{$t('重新申请')}}</span>
            </div>
        </div>
  <div class="advancedCtf">
    <assets-head :title="$t('公证认证')"></assets-head>
    <div
      class="flex items-center justify-center pt-46 pb-60"
      v-if="status != 0"
    >
      <img
        :src="
          require(`../../assets/image/certificationCenter/advStatus${status}.png`)
        "
        alt=""
        class="w-36 h-36"
      />
      <span class="ml-16 font-32 textColor">{{ fixState(status) }}</span>
    </div>
    <div class="px-32">
      <ExInput
        :label="$t('真实姓名')"
        :disabled="true"
        :clearBtn="false"
        :placeholderText="$t('请输入真实姓名')"
        v-model="name"
      />
      <ExInput
        :label="$t('工作地址')"
        :disabled="disabled()"
        :clearBtn="!disabled()"
        :placeholderText="$t('请输入您的工作地址(必填)')"
        v-model="address"
      />
      <ExInput
        :label="$t('家庭地址')"
        :disabled="disabled()"
        :clearBtn="!disabled()"
        :placeholderText="$t('请输入您的家庭地址(必填)')"
        v-model="familyAddress"
      />
    </div>
    <div class="diviLine h-16 mb-48"></div>
    <div class="px-32">
      <ExInput
        :label="$t('与本人关系')"
        :disabled="disabled()"
        :clearBtn="!disabled()"
        :placeholderText="$t('与本人关系(必填)')"
        v-model="relationMy"
      />
      <ExInput
        :label="$t('亲属姓名')"
        :disabled="disabled()"
        :clearBtn="!disabled()"
        :placeholderText="$t('请输入亲属姓名(必填)')"
        v-model="relativesName"
      />
      <ExInput
        :label="$t('亲属地址')"
        :disabled="disabled()"
        :clearBtn="!disabled()"
        :placeholderText="$t('请输入亲属地址(必填)')"
        v-model="relativesAddress"
      />
      <ExInput
        :label="$t('亲属电话')"
        :disabled="disabled()"
        :clearBtn="!disabled()"
        :placeholderText="$t('请输入亲属电话(必填)')"
        v-model="relativesPhone"
      />
      <div
        class="btnMain text-black font-34 py-26 rounded-lg text-center mt-60"
        @click="submit"
        v-if="status == 0 || status == 3"
      >
        <span v-if="status == 0">{{ $t("申请认证") }}</span>
        <span v-if="status == 3">{{ $t("重新申请") }}</span>
      </div>
    </div>
  </div>
</template>
<script>
import assetsHead from "@/components/assets-head";
import ExInput from "@/components/ex-input";
import Axios from '@/API/userCenter'
    export default {
        props: {
        },
        components: {
            assetsHead,
            ExInput
        },
        data(){
            return {
                status:'',
                name:'',
                address:'',
                familyAddress:'',
                relationMy:'',
                relativesName:'',
                relativesAddress:'',
                relativesPhone:'',
            }
        },
        created(){
            this.getInfo();
        },
        methods: {
            disabled() { // 是否禁用按钮
                return ![0, 3, ''].includes(this.status)
            },
            getInfo(){
                Axios.getKycHighLevel()
                .then(res=>{
                    this.status = res.data.status
                    this.name = res.data.name
                    this.address = res.data.work_place
                    this.familyAddress = res.data.home_place
                    this.relationMy = res.data.relatives_relation
                    this.relativesName = res.data.relatives_name
                    this.relativesAddress = res.data.relatives_place
                    this.relativesPhone = res.data.relatives_phone
                })
            },
            fixState(status){
                let str = ''
                if (status == 1) {
                    str = this.$t('审核中')
                } else if (status == 2) {
                    str = this.$t('通过认证')
                }else if(status == 3) {
                    str = this.$t('认证失败')
                }
                return str;
            },
            submit(){
                if (this.address == '' || this.address == null) {
                    this.$toast(this.$t('工作地址不能为空'))
                    return false;
                }
                if (this.familyAddress == '' || this.familyAddress == null) {
                    this.$toast(this.$t('家庭地址不能为空'))
                    return false;
                }
                if (this.relationMy == '' || this.relationMy == null) {
                    this.$toast(this.$t('与本人关系不能为空'))
                    return false;
                }
                if (this.relativesName == ''|| this.relativesName == null) {
                    this.$toast(this.$t('亲属姓名不能为空'))
                    return false;
                }
                if (this.relativesAddress == '' || this.relativesAddress == null) {
                    this.$toast(this.$t('亲属地址不能为空'))
                    return false;
                }
                if (this.relativesPhone == ''|| this.relativesPhone == null ) {
                    this.$toast(this.$t('亲属电话不能为空'))
                    return false;
                }
                Axios.kycHighLevelApply({
                    work_place: this.address,
                    home_place: this.familyAddress,
                    relatives_relation: this.relationMy,
                    relatives_name: this.relativesName,
                    relatives_place: this.relativesAddress,
                    relatives_phone: this.relativesPhone,
                }).then(res=>{
                    this.$router.push('/verified')
                    this.$toast(this.$t('申请成功'));
                }).catch(err=>{
                    if(err.code === 'ECONNABORTED'){this.$toast(this.$t('网络超时!'));}
                    else if(err.msg !== undefined){this.$toast(this.$t(err.msg));}
                })
            }
        }
    }
import Axios from "@/API/userCenter";
export default {
  props: {},
  components: {
    assetsHead,
    ExInput,
  },
  data() {
    return {
      status: "",
      name: "",
      address: "",
      familyAddress: "",
      relationMy: "",
      relativesName: "",
      relativesAddress: "",
      relativesPhone: "",
    };
  },
  created() {
    this.getInfo();
  },
  methods: {
    disabled() {
      // 是否禁用按钮
      return ![0, 3, ""].includes(this.status);
    },
    getInfo() {
      Axios.getKycHighLevel().then((res) => {
        this.status = res.data.status;
        this.name = res.data.name;
        this.address = res.data.work_place;
        this.familyAddress = res.data.home_place;
        this.relationMy = res.data.relatives_relation;
        this.relativesName = res.data.relatives_name;
        this.relativesAddress = res.data.relatives_place;
        this.relativesPhone = res.data.relatives_phone;
      });
    },
    fixState(status) {
      let str = "";
      if (status == 1) {
        str = this.$t("审核中");
      } else if (status == 2) {
        str = this.$t("通过认证");
      } else if (status == 3) {
        str = this.$t("认证失败");
      }
      return str;
    },
    submit() {
      if (this.address == "" || this.address == null) {
        this.$toast(this.$t("工作地址不能为空"));
        return false;
      }
      if (this.familyAddress == "" || this.familyAddress == null) {
        this.$toast(this.$t("家庭地址不能为空"));
        return false;
      }
      if (this.relationMy == "" || this.relationMy == null) {
        this.$toast(this.$t("与本人关系不能为空"));
        return false;
      }
      if (this.relativesName == "" || this.relativesName == null) {
        this.$toast(this.$t("亲属姓名不能为空"));
        return false;
      }
      if (this.relativesAddress == "" || this.relativesAddress == null) {
        this.$toast(this.$t("亲属地址不能为空"));
        return false;
      }
      if (this.relativesPhone == "" || this.relativesPhone == null) {
        this.$toast(this.$t("亲属电话不能为空"));
        return false;
      }
      Axios.kycHighLevelApply({
        work_place: this.address,
        home_place: this.familyAddress,
        relatives_relation: this.relationMy,
        relatives_name: this.relativesName,
        relatives_place: this.relativesAddress,
        relatives_phone: this.relativesPhone,
      })
        .then((res) => {
          this.$router.push("/verified");
          this.$toast(this.$t("申请成功"));
        })
        .catch((err) => {
          if (err.code === "ECONNABORTED") {
            this.$toast(this.$t("网络超时!"));
          } else if (err.msg !== undefined) {
            this.$toast(this.$t(err.msg));
          }
        });
    },
  },
};
</script>
<style lang="scss" scoped>
.advancedCtf{
    width: 100%;
    box-sizing: border-box;
.advancedCtf {
  width: 100%;
  box-sizing: border-box;
}
</style>