修复增加修改删除域名解析记录时无法自动刷新页面的问题
This commit is contained in:
parent
7e40d5c78e
commit
4f9a4fedbe
@ -7,7 +7,7 @@
|
||||
<div class="flex gap-2">
|
||||
<Button
|
||||
@click="refreshRecords"
|
||||
:loading="loading"
|
||||
:loading="$resources.dnsRecords.loading"
|
||||
variant="outline"
|
||||
size="sm"
|
||||
>
|
||||
@ -36,7 +36,7 @@
|
||||
</div>
|
||||
|
||||
<!-- 加载状态 -->
|
||||
<div v-if="loading" class="flex items-center justify-center py-12">
|
||||
<div v-if="$resources.dnsRecords.loading" class="flex items-center justify-center py-12">
|
||||
<div class="flex items-center space-x-2">
|
||||
<Loader2Icon class="h-5 w-5 animate-spin text-gray-500" />
|
||||
<span class="text-gray-500">正在加载DNS记录...</span>
|
||||
@ -44,18 +44,18 @@
|
||||
</div>
|
||||
|
||||
<!-- 错误状态 -->
|
||||
<div v-else-if="error" class="rounded-md border border-red-200 bg-red-50 p-4">
|
||||
<div v-else-if="$resources.dnsRecords.error" class="rounded-md border border-red-200 bg-red-50 p-4">
|
||||
<div class="flex items-center">
|
||||
<AlertCircleIcon class="h-5 w-5 text-red-400 mr-2" />
|
||||
<div>
|
||||
<h3 class="text-sm font-medium text-red-800">加载失败</h3>
|
||||
<p class="text-sm text-red-700 mt-1">{{ error }}</p>
|
||||
<p class="text-sm text-red-700 mt-1">{{ $resources.dnsRecords.error }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- DNS记录列表 -->
|
||||
<div v-else-if="!loading && !error" class="space-y-4">
|
||||
<div v-else-if="!$resources.dnsRecords.loading && !$resources.dnsRecords.error" class="space-y-4">
|
||||
<div class="overflow-hidden rounded-md border border-gray-200">
|
||||
<table class="min-w-full divide-y divide-gray-200">
|
||||
<thead class="bg-gray-50">
|
||||
@ -324,7 +324,7 @@
|
||||
</div>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<div v-else-if="!loading && !error && dnsRecords.length === 0" class="text-center py-12">
|
||||
<div v-else-if="!$resources.dnsRecords.loading && !$resources.dnsRecords.error && dnsRecords.length === 0" class="text-center py-12">
|
||||
<GlobeIcon class="mx-auto h-12 w-12 text-gray-400" />
|
||||
<h3 class="mt-2 text-sm font-medium text-gray-900">暂无DNS记录</h3>
|
||||
<p class="mt-1 text-sm text-gray-500">开始添加您的第一个DNS解析记录</p>
|
||||
@ -358,8 +358,6 @@ export default {
|
||||
props: ['domain'],
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
error: null,
|
||||
dnsRecords: [],
|
||||
pagination: {
|
||||
pageno: 1,
|
||||
@ -370,68 +368,68 @@ export default {
|
||||
selectedRecords: [] // 用于存储选中的记录ID
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 获取DNS记录
|
||||
async loadDNSRecords() {
|
||||
if (!this.$domain.pg?.domain) {
|
||||
this.error = '域名信息不存在';
|
||||
return;
|
||||
}
|
||||
|
||||
this.loading = true;
|
||||
this.error = null;
|
||||
|
||||
try {
|
||||
const request = createResource({
|
||||
url: 'jcloud.api.domain_west.get_jingrow_domain_dns_records',
|
||||
params: {
|
||||
domain: this.$domain.pg.domain,
|
||||
limit: this.pagination.limit,
|
||||
pageno: this.pagination.pageno
|
||||
},
|
||||
onSuccess: (response) => {
|
||||
this.loading = false;
|
||||
if (response.status === 'success' && response.data) {
|
||||
// 为每个记录添加编辑状态
|
||||
this.dnsRecords = (response.data.items || []).map(record => ({
|
||||
...record,
|
||||
editing: false,
|
||||
isNew: false
|
||||
}));
|
||||
|
||||
this.pagination = {
|
||||
pageno: response.data.pageno || 1,
|
||||
limit: response.data.limit || 20,
|
||||
total: response.data.total || 0,
|
||||
pagecount: response.data.pagecount || 0
|
||||
};
|
||||
} else {
|
||||
this.error = response.message || '获取DNS记录失败';
|
||||
}
|
||||
},
|
||||
onError: (error) => {
|
||||
this.loading = false;
|
||||
this.error = getToastErrorMessage(error);
|
||||
resources: {
|
||||
dnsRecords() {
|
||||
return {
|
||||
url: 'jcloud.api.domain_west.get_jingrow_domain_dns_records',
|
||||
params: {
|
||||
domain: this.$domain.pg?.domain,
|
||||
limit: this.pagination.limit,
|
||||
pageno: this.pagination.pageno
|
||||
},
|
||||
auto: true,
|
||||
onSuccess: (response) => {
|
||||
if (response.status === 'success' && response.data) {
|
||||
// 为每个记录添加编辑状态
|
||||
this.dnsRecords = (response.data.items || []).map(record => ({
|
||||
...record,
|
||||
editing: false,
|
||||
isNew: false
|
||||
}));
|
||||
|
||||
this.pagination = {
|
||||
pageno: response.data.pageno || 1,
|
||||
limit: response.data.limit || 20,
|
||||
total: response.data.total || 0,
|
||||
pagecount: response.data.pagecount || 0
|
||||
};
|
||||
} else {
|
||||
this.error = response.message || '获取DNS记录失败';
|
||||
}
|
||||
});
|
||||
request.submit();
|
||||
} catch (error) {
|
||||
this.loading = false;
|
||||
this.error = '获取DNS记录时发生错误';
|
||||
console.error('加载DNS记录失败:', error);
|
||||
}
|
||||
},
|
||||
|
||||
},
|
||||
onError: (error) => {
|
||||
this.error = getToastErrorMessage(error);
|
||||
}
|
||||
};
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 刷新记录
|
||||
refreshRecords() {
|
||||
this.loadDNSRecords();
|
||||
// 更新资源参数并立即重新加载
|
||||
this.$resources.dnsRecords.update({
|
||||
params: {
|
||||
domain: this.$domain.pg?.domain,
|
||||
limit: this.pagination.limit,
|
||||
pageno: this.pagination.pageno
|
||||
}
|
||||
});
|
||||
this.$resources.dnsRecords.reload();
|
||||
},
|
||||
|
||||
// 切换页面
|
||||
changePage(page) {
|
||||
if (page >= 1 && page <= this.pagination.pagecount) {
|
||||
this.pagination.pageno = page;
|
||||
this.loadDNSRecords();
|
||||
// 更新资源参数并立即重新加载
|
||||
this.$resources.dnsRecords.update({
|
||||
params: {
|
||||
domain: this.$domain.pg?.domain,
|
||||
limit: this.pagination.limit,
|
||||
pageno: this.pagination.pageno
|
||||
}
|
||||
});
|
||||
this.$resources.dnsRecords.reload();
|
||||
}
|
||||
},
|
||||
|
||||
@ -565,8 +563,17 @@ export default {
|
||||
toast.success('DNS记录保存成功');
|
||||
record.editing = false;
|
||||
record.isNew = false;
|
||||
// 重新加载记录列表
|
||||
this.loadDNSRecords();
|
||||
// 重新加载记录列表（等待异步操作完成）
|
||||
setTimeout(() => {
|
||||
this.$resources.dnsRecords.update({
|
||||
params: {
|
||||
domain: this.$domain.pg?.domain,
|
||||
limit: this.pagination.limit,
|
||||
pageno: this.pagination.pageno
|
||||
}
|
||||
});
|
||||
this.$resources.dnsRecords.reload();
|
||||
}, 1000);
|
||||
} else {
|
||||
toast.error(response.message || '保存DNS记录失败');
|
||||
}
|
||||
@ -629,7 +636,16 @@ export default {
|
||||
if (response.status === 'success') {
|
||||
toast.success('DNS记录删除成功');
|
||||
hide();
|
||||
this.loadDNSRecords();
|
||||
setTimeout(() => {
|
||||
this.$resources.dnsRecords.update({
|
||||
params: {
|
||||
domain: this.$domain.pg?.domain,
|
||||
limit: this.pagination.limit,
|
||||
pageno: this.pagination.pageno
|
||||
}
|
||||
});
|
||||
this.$resources.dnsRecords.reload();
|
||||
}, 1000);
|
||||
} else {
|
||||
toast.error(response.message || '删除DNS记录失败');
|
||||
}
|
||||
@ -690,12 +706,30 @@ export default {
|
||||
if (response.status === 'success') {
|
||||
toast.success(response.message || `批量删除 ${validRecordIds.length} 条DNS记录成功`);
|
||||
hide();
|
||||
this.loadDNSRecords();
|
||||
setTimeout(() => {
|
||||
this.$resources.dnsRecords.update({
|
||||
params: {
|
||||
domain: this.$domain.pg?.domain,
|
||||
limit: this.pagination.limit,
|
||||
pageno: this.pagination.pageno
|
||||
}
|
||||
});
|
||||
this.$resources.dnsRecords.reload();
|
||||
}, 1000);
|
||||
this.selectedRecords = []; // 清空选中
|
||||
} else if (response.status === 'partial_success') {
|
||||
toast.success(response.message || '批量删除部分成功');
|
||||
hide();
|
||||
this.loadDNSRecords();
|
||||
setTimeout(() => {
|
||||
this.$resources.dnsRecords.update({
|
||||
params: {
|
||||
domain: this.$domain.pg?.domain,
|
||||
limit: this.pagination.limit,
|
||||
pageno: this.pagination.pageno
|
||||
}
|
||||
});
|
||||
this.$resources.dnsRecords.reload();
|
||||
}, 1000);
|
||||
this.selectedRecords = []; // 清空选中
|
||||
} else {
|
||||
toast.error(response.message || '批量删除DNS记录失败');
|
||||
@ -788,7 +822,7 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadDNSRecords();
|
||||
// 组件会自动加载DNS记录，因为resources设置了auto: true
|
||||
}
|
||||
};
|
||||
</script>
|
||||
Loading…
x
Reference in New Issue
Block a user