From a6d944f98f4142dce4144f3a44582ac1f7fad473 Mon Sep 17 00:00:00 2001 From: zhongzm Date: Wed, 12 Feb 2025 10:52:27 +0800 Subject: [PATCH] =?UTF-8?q?feat:kyc=E7=8A=B6=E6=80=81=E6=98=BE=E7=A4=BA?= =?UTF-8?q?=E9=97=AE=E9=A2=98=E4=BF=AE=E5=A4=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/userInfo/kyc/index.vue | 169 +++++++++++++++++++++++++++---- 1 file changed, 147 insertions(+), 22 deletions(-) diff --git a/src/views/userInfo/kyc/index.vue b/src/views/userInfo/kyc/index.vue index 88e233a..c971925 100644 --- a/src/views/userInfo/kyc/index.vue +++ b/src/views/userInfo/kyc/index.vue @@ -101,31 +101,53 @@ const getBase64 = (file: File): Promise => { // 获取 KYC 状态 const getKYCStatus = async () => { try { - const { data } = await fetchKYCStatus(); - if (data?.status) { - // 将状态转换为标准格式 - const normalizedStatus = data.status.toUpperCase() as Api.KYC.KYCStatus; - kycStatus.value = normalizedStatus; - kycInfo.value = { - ...data, - status: normalizedStatus - }; - } else { - // 如果没有状态数据,设置为默认值 - kycStatus.value = 'UNVERIFIED'; - kycInfo.value = { - status: 'UNVERIFIED', - fullName: '', - birthDate: '', - rejectReason: '', - verifiedTime: '' - }; - console.warn('No KYC status data received'); + const response = await fetchKYCStatus(); + console.log('KYC Response:', response); + + // 检查响应数据结构 + if (response?.data?.rows && Array.isArray(response.data.rows) && response.data.rows.length > 0) { + // 获取第一条记录 + const kycData = response.data.rows[0]; + console.log('KYC Data:', kycData); + + if (kycData && kycData.status) { + // 将状态转换为标准格式,不区分大小写 + const normalizedStatus = kycData.status.toUpperCase() as Api.KYC.KYCStatus; + console.log('Normalized status:', normalizedStatus); + + // 确保状态值有效 + if (['UNVERIFIED', 'PENDING', 'VERIFIED', 'REJECTED'].includes(normalizedStatus)) { + kycStatus.value = normalizedStatus; + kycInfo.value = { + status: normalizedStatus, + fullName: kycData.realName || '', + birthDate: kycData.birthDate || '', + rejectReason: kycData.description || '', + verifiedTime: kycData.updateTime || kycData.createTime || '', + idType: kycData.idType, + idFile: kycData.idFile, + identifyPicture: kycData.identifyPicture + }; + return; // 成功处理后直接返回 + } + } } + + // 如果没有有效的状态数据,设置为默认值 + console.warn('Invalid or missing KYC status data:', response); + kycStatus.value = 'UNVERIFIED'; + kycInfo.value = { + status: 'UNVERIFIED', + fullName: '', + birthDate: '', + rejectReason: '', + verifiedTime: '' + }; + } catch (error) { console.error('Failed to fetch KYC status:', error); message.error(t('page.kyc.kycerror')); - // 发生错误时也设置默认值 + // 发生错误时设置默认值 kycStatus.value = 'UNVERIFIED'; kycInfo.value = { status: 'UNVERIFIED', @@ -273,6 +295,21 @@ const getStatusText = (status: Api.KYC.KYCStatus) => { } }; +// 获取证件类型标签 +const getIdTypeLabel = (idType: number | string | undefined) => { + if (!idType) return ''; + const option = idTypeOptions.value.find(opt => opt.value === Number(idType)); + return option ? option.label : ''; +}; + +// 处理已认证状态下的图片预览 +const handleVerifiedImagePreview = (imageUrl: string | undefined) => { + if (!imageUrl) return; + previewImage.value = imageUrl; + previewVisible.value = true; + previewTitle.value = imageUrl.substring(imageUrl.lastIndexOf('/') + 1); +}; + onMounted(() => { getKYCStatus(); }); @@ -298,17 +335,40 @@ onMounted(() => { +
{{ t('page.kyc.cername') }} {{ kycInfo.fullName }}
+
+ {{ t('page.kyc.birthdate') }} + {{ kycInfo.birthDate }} +
+
+ {{ t('page.kyc.idtype') }} + {{ getIdTypeLabel(kycInfo.idType) }} +
{{ t('page.kyc.certime') }} {{ kycInfo.verifiedTime }}
+ +
+ {{ t('page.kyc.idphoto') }} +
+ +
+
+
+ {{ t('page.kyc.photopic') }} +
+ +
+
+
{ :footer="null" @cancel="previewVisible = false" > - +
@@ -533,6 +593,20 @@ onMounted(() => { width: 100%; max-width: none; } + + .info-item { + flex-direction: column; + } + + .info-item .label { + width: 100%; + margin-bottom: 8px; + } + + .image-preview { + width: 100%; + height: 200px; + } } /* 平板适配 */ @@ -557,4 +631,55 @@ onMounted(() => { } } +.verified-info { + margin-top: 24px; + padding: 16px; + background: #f8f8f8; + border-radius: 8px; +} + +.info-item { + display: flex; + margin-bottom: 16px; + align-items: flex-start; +} + +.info-item .label { + width: 120px; + color: #666; + font-size: 14px; +} + +.info-item .value { + flex: 1; + color: #333; + font-size: 14px; + word-break: break-all; +} + +.image-preview { + width: 120px; + height: 120px; + border-radius: 4px; + overflow: hidden; + cursor: pointer; + border: 1px solid #e8e8e8; + transition: all 0.3s; +} + +.image-preview:hover { + border-color: #1890ff; + box-shadow: 0 2px 8px rgba(0,0,0,0.15); +} + +.image-preview img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.reject-reason { + margin-top: 16px; +} +