美化域名详情页查看认证信息弹窗

This commit is contained in:
jingrow 2025-08-03 18:33:58 +08:00
parent aad3101d8f
commit 69ff95c741

View File

@ -13,54 +13,54 @@
<p class="text-gray-600">{{ error }}</p> <p class="text-gray-600">{{ error }}</p>
</div> </div>
<div v-else-if="realNameData" class="space-y-6"> <div v-else-if="realNameData" class="space-y-4">
<!-- 域名基本信息 --> <!-- 域名基本信息 -->
<div class="bg-white rounded-lg "> <div class="bg-white rounded-lg">
<div class="px-6 py-4 border-b border-gray-100"> <div class="px-6 py-4 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-900">域名基本信息</h3> <h3 class="text-base font-semibold text-gray-900">域名基本信息</h3>
</div> </div>
<div class="p-6 space-y-4"> <div class="p-6 space-y-4">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">域名</span> <span class="text-sm text-gray-600">域名</span>
<span class="font-medium text-gray-900">{{ realNameData.domain }}</span> <span class="text-sm font-medium text-gray-900">{{ realNameData.domain }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">注册时间</span> <span class="text-sm text-gray-600">注册时间</span>
<span class="font-medium text-gray-900">{{ formatDateTime(realNameData.regdate) }}</span> <span class="text-sm font-medium text-gray-900">{{ formatDateTime(realNameData.regdate) }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">到期时间</span> <span class="text-sm text-gray-600">到期时间</span>
<span class="font-medium text-gray-900">{{ formatDateTime(realNameData.rexpiredate) }}</span> <span class="text-sm font-medium text-gray-900">{{ formatDateTime(realNameData.rexpiredate) }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">域名状态</span> <span class="text-sm text-gray-600">域名状态</span>
<span class="font-medium text-green-600">{{ getDomainStatusText(realNameData.status) }}</span> <span class="text-sm font-medium text-green-600">{{ getDomainStatusText(realNameData.status) }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">实名状态</span> <span class="text-sm text-gray-600">实名状态</span>
<span class="font-medium text-green-600">{{ getRealNameStatusText(realNameData.real_name_status?.r_status) }}</span> <span class="text-sm font-medium text-green-600">{{ getRealNameStatusText(realNameData.real_name_status?.r_status) }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">域名所有者</span> <span class="text-sm text-gray-600">域名所有者</span>
<span class="font-medium text-gray-900">{{ realNameData.owner?.dom_org_m || '未填写' }}</span> <span class="text-sm font-medium text-gray-900">{{ realNameData.owner?.dom_org_m || '未填写' }}</span>
</div> </div>
</div> </div>
</div> </div>
<!-- 实名证件信息 --> <!-- 实名证件信息 -->
<div class="bg-white rounded-lg "> <div class="bg-white rounded-lg">
<div class="px-6 py-4 border-b border-gray-100"> <div class="px-6 py-4 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-900">实名证件信息</h3> <h3 class="text-base font-semibold text-gray-900">实名证件信息</h3>
</div> </div>
<div class="p-6 space-y-4"> <div class="p-6 space-y-4">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">实名证件类型</span> <span class="text-sm text-gray-600">实名证件类型</span>
<span class="font-medium text-gray-900">{{ getDocumentTypeText(realNameData.orgfile?.f_type) }}</span> <span class="text-sm font-medium text-gray-900">{{ getDocumentTypeText(realNameData.orgfile?.f_type) }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">实名证件号码</span> <span class="text-sm text-gray-600">实名证件号码</span>
<div class="flex items-center space-x-2"> <div class="flex items-center space-x-2">
<span class="font-medium text-gray-900">{{ realNameData.orgfile?.f_code || '未填写' }}</span> <span class="text-sm font-medium text-gray-900">{{ realNameData.orgfile?.f_code || '未填写' }}</span>
<button class="text-blue-600 hover:text-blue-800"> <button class="text-blue-600 hover:text-blue-800">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
@ -73,30 +73,30 @@
</div> </div>
<!-- 联系信息 --> <!-- 联系信息 -->
<div class="bg-white rounded-lg "> <div class="bg-white rounded-lg">
<div class="px-6 py-4 border-b border-gray-100"> <div class="px-6 py-4 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-900">联系信息</h3> <h3 class="text-base font-semibold text-gray-900">联系信息</h3>
</div> </div>
<div class="p-6 space-y-4"> <div class="p-6 space-y-4">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">联系电话</span> <span class="text-sm text-gray-600">联系电话</span>
<span class="font-medium text-gray-900">{{ realNameData.owner?.dom_ph || '未填写' }}</span> <span class="text-sm font-medium text-gray-900">{{ realNameData.owner?.dom_ph || '未填写' }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">所有者邮箱</span> <span class="text-sm text-gray-600">所有者邮箱</span>
<span class="font-medium text-gray-900">{{ realNameData.owner?.dom_em || '未填写' }}</span> <span class="text-sm font-medium text-gray-900">{{ realNameData.owner?.dom_em || '未填写' }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">所属区域</span> <span class="text-sm text-gray-600">所属区域</span>
<span class="font-medium text-gray-900">{{ getFullAddress() }}</span> <span class="text-sm font-medium text-gray-900">{{ getFullAddress() }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">通讯地址</span> <span class="text-sm text-gray-600">通讯地址</span>
<span class="font-medium text-gray-900">{{ realNameData.owner?.dom_adr_m || '未填写' }}</span> <span class="text-sm font-medium text-gray-900">{{ realNameData.owner?.dom_adr_m || '未填写' }}</span>
</div> </div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<span class="text-gray-600">邮编</span> <span class="text-sm text-gray-600">邮编</span>
<span class="font-medium text-gray-900">{{ realNameData.owner?.dom_pc || '未填写' }}</span> <span class="text-sm font-medium text-gray-900">{{ realNameData.owner?.dom_pc || '未填写' }}</span>
</div> </div>
</div> </div>
</div> </div>
@ -133,10 +133,7 @@ export default {
}, },
methods: { methods: {
async loadRealNameInfo() { async loadRealNameInfo() {
console.log('loadRealNameInfo called, domainDoc:', this.domainDoc);
if (!this.domainDoc?.domain) { if (!this.domainDoc?.domain) {
console.error('域名信息不存在, domainDoc:', this.domainDoc);
this.error = '域名信息不存在'; this.error = '域名信息不存在';
return; return;
} }
@ -151,9 +148,6 @@ export default {
domain: this.domainDoc.domain domain: this.domainDoc.domain
}, },
onSuccess: (response) => { onSuccess: (response) => {
console.log('API响应:', response);
// API
let data = null; let data = null;
if (response && response.status === "success" && response.data) { if (response && response.status === "success" && response.data) {
data = response.data; data = response.data;
@ -162,24 +156,20 @@ export default {
} }
if (data) { if (data) {
console.log('提取的数据:', data);
this.realNameData = data; this.realNameData = data;
} else { } else {
console.error('无效的响应格式:', response);
this.error = '获取实名认证信息失败'; this.error = '获取实名认证信息失败';
} }
this.loading = false; this.loading = false;
}, },
onError: (error) => { onError: (error) => {
console.error('获取域名实名信息失败:', error);
this.error = '获取实名认证信息失败'; this.error = '获取实名认证信息失败';
this.loading = false; this.loading = false;
} }
}); });
getRealNameRequest.submit(); getRealNameRequest.submit();
} catch (error) { } catch (error) {
console.error('获取域名实名信息失败:', error);
this.error = '获取实名认证信息失败'; this.error = '获取实名认证信息失败';
this.loading = false; this.loading = false;
} }
@ -221,7 +211,7 @@ export default {
const typeMap = { const typeMap = {
1: '身份证', 1: '身份证',
2: '护照', 2: '护照',
3: '工商营业执照(统一社会信用代码)', 3: '营业执照(统一社会信用代码)',
4: '组织机构代码证', 4: '组织机构代码证',
5: '其他' 5: '其他'
}; };