refactor: 为新增按钮添加加载状态管理

统一三个页面的新增按钮加载状态处理,通过封装handleAdd函数统一控制loading状态,避免重复代码,提升交互体验
This commit is contained in:
zhangtao
2026-06-21 17:40:09 +08:00
parent 7d2367e34e
commit 3389781834
3 changed files with 38 additions and 5 deletions
@@ -49,7 +49,7 @@
<ElCard shadow="hover" class="fa-table-card" :style="{ 'margin-top': '0' }">
<FaTableHeader :loading="myLoading" @refresh="getMyData">
<template #left>
<FaTableHeaderLeft perm-create="tenant:admin" @add="openApplyDialog" />
<FaTableHeaderLeft perm-create="tenant:admin" :create-loading="createLoading" @add="handleAdd" />
</template>
</FaTableHeader>
@@ -382,6 +382,17 @@ const applyRules = {
title: [{ required: true, message: "请输入发票抬头", trigger: "blur" }],
};
const createLoading = ref(false);
async function handleAdd() {
createLoading.value = true;
try {
openApplyDialog();
} finally {
createLoading.value = false;
}
}
function openApplyDialog() {
Object.assign(applyFormData, {
order_id: null,
@@ -34,7 +34,8 @@
:perm-create="['module_task:workflow:definition:create']"
:perm-delete="['module_task:workflow:definition:delete']"
:delete-loading="batchDeleting"
@add="handleCreate"
:create-loading="createLoading"
@add="handleAdd"
@delete="handleBatchDelete"
/>
</template>
@@ -194,8 +195,9 @@ const selectedIds = computed(() =>
selectedRows.value.map((r) => r.id).filter((id): id is number => typeof id === "number")
);
const batchDeleting = ref(false);
function onTableSelectionChange(rows: WorkflowTable[]) {
const createLoading = ref(false);
function onTableSelectionChange(rows: WorkflowTable[]) {
selectedRows.value = rows;
}
@@ -331,6 +333,15 @@ async function onResetSearch() {
const selectedWorkflow = ref<WorkflowTable>();
const createVisible = ref(false);
async function handleAdd() {
createLoading.value = true;
try {
handleCreate();
} finally {
createLoading.value = false;
}
}
function handleCreate() {
selectedWorkflow.value = undefined;
createVisible.value = true;
@@ -34,7 +34,8 @@
:perm-create="['module_task:workflow:node-type:create']"
:perm-delete="['module_task:workflow:node-type:delete']"
:delete-loading="batchDeleting"
@add="openDialog()"
:create-loading="createLoading"
@add="handleAdd"
@delete="handleBatchDelete"
/>
</template>
@@ -194,6 +195,7 @@ const selectedIds = computed(() =>
selectedRows.value.map((r) => r.id).filter((id): id is number => typeof id === "number")
);
const batchDeleting = ref(false);
const createLoading = ref(false);
function onTableSelectionChange(rows: WorkflowNodeTypeTable[]) {
selectedRows.value = rows;
@@ -456,6 +458,15 @@ function handleCloseDialog() {
resetForm();
}
async function handleAdd() {
createLoading.value = true;
try {
await openDialog();
} finally {
createLoading.value = false;
}
}
async function openDialog(id?: number) {
resetForm();
dialogTitle.value = id ? "编辑节点类型" : "新增节点类型";