From 03043192ddf00f9a36b7454799a9152cd1b50a0b Mon Sep 17 00:00:00 2001
From: admin <344137771@qq.com>
Date: Tue, 06 Jan 2026 11:13:45 +0800
Subject: [PATCH] 1
---
src/views/register/identity.vue | 151 +++++++++++++++++++++++++++++++++++++++++++++++--
1 files changed, 143 insertions(+), 8 deletions(-)
diff --git a/src/views/register/identity.vue b/src/views/register/identity.vue
index 5fa0150..d2eecce 100644
--- a/src/views/register/identity.vue
+++ b/src/views/register/identity.vue
@@ -34,6 +34,19 @@
</div>
<ExInput :label="$t('realName')" :placeholderText="$t('entryRealName')" v-model="name" />
<ExInput :label="$t('credentPassport')" :placeholderText="$t('entryCredentPassport')" v-model="idnumber" />
+ <ExInput :label="$t('phoneNum')" :disabled="disabled()" :clearBtn="!disabled()"
+ :placeholderText="$t('entryPhone')" v-model="phone" :area="true" :dialCode="dialCode"
+ @selectArea="onSelectArea" :icon="icon" />
+ <!-- 验证码输入框已隐藏 -->
+ <!-- <p class="label mt-2 textColor" v-if="!disabled()">{{ $t("verificationCode") }}</p>
+ <div class="iptbox inputBackground" v-if="!disabled()">
+ <input class="inputBackground textColor" type="text" :placeholder="$t('entryVerifyCode')"
+ v-model="verifyCode" :disabled="disabled()" />
+ <span @click="sendCode" :class="{ 'disabled': time > 0 }">
+ {{ $t("sendVerifyCode") }}
+ <template v-if="time"> ({{ time }})s</template>
+ </span>
+ </div> -->
<div>
<div v-if="resultArr.length > 0" class="mb-13 textColor">{{ $t('uploadCredentPassport') }}</div>
<div v-else class="mt-55 mb-13">{{ $t('uploadPicCredentPassport') }}</div>
@@ -57,7 +70,7 @@
</div>
<div class="mt-3 text-20 h-5 textColor">{{ $t('credentObverse') }}</div>
</div>
- <div class="flex-1 flex flex-col text-center justify-center items-center">
+ <!-- <div class="flex-1 flex flex-col text-center justify-center items-center">
<div class="upload-wrap">
<img src="@/assets/image/kyc/2.png" alt="" class="w-full"
v-if="[1, 2].includes(status) && fileList.length === 0" />
@@ -65,12 +78,12 @@
:after-read="afterRead" @click-upload="onClickUpload('fileList')" v-else />
</div>
<div class="mt-3 text-20 h-5 textColor">{{ $t('handCredent') }}</div>
- </div>
+ </div> -->
</div>
</div>
<template v-if="!disabled()">
- <div class="mb-4 textColor text-26">{{ $t('photoExample') }}</div>
- <img src="@/assets/image/kyc/kyc-demo.png" alt="" style="width:100%;height:auto;" class="w-auto h-56 mb-24">
+ <!-- <div class="mb-4 textColor text-26">{{ $t('photoExample') }}</div> -->
+ <!-- <img src="@/assets/image/kyc/kyc-demo.png" alt="" style="width:100%;height:auto;" class="w-auto h-56 mb-24"> -->
<!-- <div class="mb-100 flex justify-center">
<div class="flex flex-1 justify-center">
<img src="../../assets/image/kyc/kyc_demo1.png" alt="" class="w-80 h-80" />
@@ -84,6 +97,7 @@
</van-button>
<nationality-list ref='controlChildRef' :title="$t('selectNation')" @getName="getName" v-if="!disabled()">
</nationality-list>
+ <nationality-list ref="controlChildRefPhone" :title="$t('selectArea')" @getName="getName1"></nationality-list>
</div>
</div>
</template>
@@ -94,11 +108,12 @@
import { Uploader } from 'vant';
import { _applyIdentify, _getIdentify } from '@/service/user.api.js'
import { _uploadImage } from '@/service/upload.api'
+import { _sendVerifyCode } from "@/service/login.api.js";
import countriesinit from "../authentication/components/countryList";
import ExInput from "@/components/ex-input/index.vue";
import { showToast } from "vant";
import { useRouter } from "vue-router";
-import { ref, reactive, onMounted } from "vue";
+import { ref, reactive, onMounted, onBeforeUnmount } from "vue";
import { useI18n } from 'vue-i18n'
const { locale, t } = useI18n()
const router = useRouter()
@@ -108,6 +123,12 @@
const countryCode = ref('af') //国家地区号
const idnumber = ref('')
const name = ref('')
+const phone = ref('')
+const icon = ref('')
+const dialCode = ref('')
+const verifyCode = ref('')
+const time = ref(0)
+const timer = ref(null)
const frontFile = ref([])
const reverseFile = ref([])
@@ -121,6 +142,13 @@
fetchInfo()
})
+onBeforeUnmount(() => {
+ if (timer.value) {
+ clearInterval(timer.value)
+ timer.value = null
+ }
+})
+
const fetchInfo = () => { // 获取状态
_getIdentify().then(data => {
@@ -130,9 +158,10 @@
countryCode.value = data.nationality
idnumber.value = data.idnumber
name.value = data.name
+ phone.value = data.phone || ''
frontFile.value = data.idimg_1 ? [{ url: data.idimg_1_path }] : []
reverseFile.value = data.idimg_2 ? [{ url: data.idimg_2_path }] : []
- fileList.value = data.idimg_3 ? [{ url: data.idimg_3_path }] : []
+ // fileList.value = data.idimg_3 ? [{ url: data.idimg_3_path }] : []
}
})
}
@@ -178,6 +207,54 @@
countryName.value = params.name;
countryCode.value = params.code;
}
+
+//获取到当前选中国家的手机号code值
+const getName1 = (params) => {
+ icon.value = params.code;
+ dialCode.value = params.dialCode;
+}
+
+const controlChildRefPhone = ref(null);
+const onSelectArea = () => {
+ controlChildRefPhone.value.open();
+};
+
+// 发送验证码
+const sendCode = () => {
+ if (!phone.value) {
+ showToast(t('entryPhone'))
+ return
+ }
+ // 校验手机号格式：必须是数字
+ if (isNaN(phone.value) || phone.value.trim() === '') {
+ showToast(t('请输入正确的手机号码'))
+ return
+ }
+ if (time.value > 0) {
+ return false
+ }
+ _sendVerifyCode({
+ target: `${dialCode.value || ''}${phone.value}`,
+ }).then((res) => {
+ showToast(t("sendSuccess"))
+ time.value = 30
+ timer.value = setInterval(() => {
+ if (time.value > 0) {
+ time.value = time.value - 1
+ } else {
+ time.value = 0
+ clearInterval(timer.value)
+ timer.value = null
+ }
+ }, 1000)
+ }).catch(err => {
+ if (err.msg !== undefined) {
+ showToast(err.msg)
+ } else {
+ showToast(t('sendFailed'))
+ }
+ })
+}
const onSubmit = () => {
if (!countryName.value) {
@@ -192,7 +269,26 @@
showToast(t('entryCredent'))
return
}
- if (!frontFile.value.length || !reverseFile.value.length || !fileList.value.length) {
+ if (!phone.value) {
+ showToast(t('entryPhone'))
+ return
+ }
+ // 校验手机号格式：必须是数字
+ if (isNaN(phone.value) || phone.value.trim() === '') {
+ showToast(t('请输入正确的手机号码'))
+ return
+ }
+ // 验证码校验已隐藏
+ // if (!verifyCode.value) {
+ // showToast(t('entryVerifyCode'))
+ // return
+ // }
+ // if (verifyCode.value.length < 6) {
+ // showToast(t('entryVerifyTips'))
+ // return
+ // }
+ // if (!frontFile.value.length || !reverseFile.value.length || !fileList.value.length) {
+ if (!frontFile.value.length || !reverseFile.value.length) {
showToast(t('uploadComplete'))
return
}
@@ -203,9 +299,11 @@
_applyIdentify({
name: name.value,
idnumber: idnumber.value,
+ phone: "" + dialCode.value + phone.value,
+ code: '', // 验证码已隐藏，传空值
frontFile: frontFile.value,
reverseFile: reverseFile.value,
- fileList: fileList.value,
+ // fileList: fileList.value,
countryName: countryCode.value // countryName 存储的 code, 回来再遍历
}).then(() => {
showToast(t('submitSuccess'))
@@ -284,4 +382,41 @@
.city {
background: $light-grey;
}
+
+.label {
+ font-size: 14px;
+ margin-bottom: 9px;
+}
+
+.iptbox {
+ height: 44px;
+ margin-top: 8px;
+ padding: 0 10px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ border-radius: 3px;
+
+ input {
+ flex: 1;
+ height: 100%;
+ border: none;
+ padding-left: 10px;
+ color: $text_color;
+ font-size: 14px;
+ }
+
+ span {
+ color: $color_main;
+ font-size: 14px;
+ cursor: pointer;
+ white-space: nowrap;
+ margin-left: 10px;
+
+ &.disabled {
+ color: $text_color1;
+ cursor: not-allowed;
+ }
+ }
+}
</style>
--
Gitblit v1.9.3