perf: 方法名前缀 handle

apps/web-antd/src/views/system/area/index.vue

@@ -24,7 +24,7 @@ function onRefresh() {
 }
 
 /** 查询 IP */
-function onQueryIp() {
+function handleQueryIp() {
   formModalApi.setData(null).open();
 }
 
@@ -66,7 +66,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     <FormModal @success="onRefresh" />
     <Grid table-title="地区列表">
       <template #toolbar-tools>
-        <Button type="primary" @click="onQueryIp">
+        <Button type="primary" @click="handleQueryIp">
           <Search class="size-5" />
           IP 查询
         </Button>

apps/web-antd/src/views/system/dept/index.vue

@@ -25,9 +25,9 @@ const [FormModal, formModalApi] = useVbenModal({
 const userList = ref<SystemUserApi.User[]>([]);
 
 /** 获取负责人名称 */
-const getLeaderName = (userId: number) => {
+function getLeaderName(userId: number) {
   return userList.value.find((user) => user.id === userId)?.nickname;
-};
+}
 
 /** 刷新表格 */
 function onRefresh() {
@@ -42,32 +42,36 @@ function toggleExpand() {
 }
 
 /** 创建部门 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 添加下级部门 */
-function onAppend(row: SystemDeptApi.Dept) {
+function handleAppend(row: SystemDeptApi.Dept) {
   formModalApi.setData({ parentId: row.id }).open();
 }
 
 /** 编辑部门 */
-function onEdit(row: SystemDeptApi.Dept) {
+function handleEdit(row: SystemDeptApi.Dept) {
   formModalApi.setData(row).open();
 }
 
 /** 删除部门 */
-async function onDelete(row: SystemDeptApi.Dept) {
+async function handleDelete(row: SystemDeptApi.Dept) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
+  try {
     await deleteDept(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -119,7 +123,7 @@ onMounted(async () => {
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:dept:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: isExpanded ? '收缩' : '展开',
@@ -137,14 +141,14 @@ onMounted(async () => {
               type: 'link',
               icon: ACTION_ICON.ADD,
               auth: ['system:menu:create'],
-              onClick: onAppend.bind(null, row),
+              onClick: handleAppend.bind(null, row),
             },
             {
               label: $t('common.edit'),
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:menu:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -155,7 +159,7 @@ onMounted(async () => {
               disabled: !!(row.children && row.children.length > 0),
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/dict/index.vue

@@ -10,7 +10,7 @@ import TypeGrid from './modules/type-grid.vue';
 
 const searchDictType = ref<string>(); // 搜索的字典类型
 
-function onDictTypeSelect(dictType: string) {
+function handleDictTypeSelect(dictType: string) {
   searchDictType.value = dictType;
 }
 </script>
@@ -24,7 +24,7 @@ function onDictTypeSelect(dictType: string) {
     <div class="flex h-full">
       <!-- 左侧字典类型列表 -->
       <div class="w-1/2 pr-3">
-        <TypeGrid @select="onDictTypeSelect" />
+        <TypeGrid @select="handleDictTypeSelect" />
       </div>
       <!-- 右侧字典数据列表 -->
       <div class="w-1/2">

apps/web-antd/src/views/system/dict/modules/data-grid.vue

@@ -38,33 +38,37 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportDictData(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '字典数据.xls', source: data });
 }
 
 /** 创建字典数据 */
-function onCreate() {
+function handleCreate() {
   dataFormModalApi.setData({ dictType: props.dictType }).open();
 }
 
 /** 编辑字典数据 */
-function onEdit(row: SystemDictDataApi.DictData) {
+function handleEdit(row: SystemDictDataApi.DictData) {
   dataFormModalApi.setData(row).open();
 }
 
 /** 删除字典数据 */
-async function onDelete(row: SystemDictDataApi.DictData) {
+async function handleDelete(row: SystemDictDataApi.DictData) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.label]),
     key: 'action_key_msg',
   });
+  try {
     await deleteDictData(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.label]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -121,14 +125,14 @@ watch(
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:dict:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: $t('ui.actionTitle.export'),
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:dict:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -141,7 +145,7 @@ watch(
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:dict:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -151,7 +155,7 @@ watch(
               auth: ['system:dict:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.label]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/dict/modules/type-grid.vue

@@ -34,33 +34,37 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportDictType(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '字典类型.xls', source: data });
 }
 
 /** 创建字典类型 */
-function onCreate() {
+function handleCreate() {
   typeFormModalApi.setData(null).open();
 }
 
 /** 编辑字典类型 */
-function onEdit(row: any) {
+function handleEdit(row: any) {
   typeFormModalApi.setData(row).open();
 }
 
 /** 删除字典类型 */
-async function onDelete(row: SystemDictTypeApi.DictType) {
+async function handleDelete(row: SystemDictTypeApi.DictType) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
+  try {
     await deleteDictType(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 /** 表格事件 */
@@ -115,14 +119,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:dict:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: $t('ui.actionTitle.export'),
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:dict:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -135,7 +139,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:dict:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -145,7 +149,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:dict:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/loginlog/index.vue

@@ -24,13 +24,13 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportLoginLog(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '登录日志.xls', source: data });
 }
 
 /** 查看登录日志详情 */
-function onDetail(row: SystemLoginLogApi.LoginLog) {
+function handleDetail(row: SystemLoginLogApi.LoginLog) {
   detailModalApi.setData(row).open();
 }
 
@@ -80,7 +80,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:login-log:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -93,7 +93,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.VIEW,
               auth: ['system:login-log:query'],
-              onClick: onDetail.bind(null, row),
+              onClick: handleDetail.bind(null, row),
             },
           ]"
         />

apps/web-antd/src/views/system/mail/account/index.vue

@@ -28,27 +28,31 @@ function onRefresh() {
 }
 
 /** 创建邮箱账号 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑邮箱账号 */
-function onEdit(row: SystemMailAccountApi.MailAccount) {
+function handleEdit(row: SystemMailAccountApi.MailAccount) {
   formModalApi.setData(row).open();
 }
 
 /** 删除邮箱账号 */
-async function onDelete(row: SystemMailAccountApi.MailAccount) {
+async function handleDelete(row: SystemMailAccountApi.MailAccount) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.mail]),
     key: 'action_key_msg',
   });
+  try {
     await deleteMailAccount(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.mail]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -96,7 +100,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:mail-account:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
           ]"
         />
@@ -109,7 +113,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:mail-account:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -119,7 +123,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:mail-account:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/mail/log/index.vue

@@ -22,7 +22,7 @@ function onRefresh() {
 }
 
 /** 查看邮件日志 */
-function onDetail(row: SystemMailLogApi.MailLog) {
+function handleDetail(row: SystemMailLogApi.MailLog) {
   detailModalApi.setData(row).open();
 }
 
@@ -71,7 +71,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.VIEW,
               auth: ['system:mail-log:query'],
-              onClick: onDetail.bind(null, row),
+              onClick: handleDetail.bind(null, row),
             },
           ]"
         />

apps/web-antd/src/views/system/mail/template/index.vue

@@ -40,22 +40,22 @@ function onRefresh() {
 }
 
 /** 创建邮件模板 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑邮件模板 */
-function onEdit(row: SystemMailTemplateApi.MailTemplate) {
+function handleEdit(row: SystemMailTemplateApi.MailTemplate) {
   formModalApi.setData(row).open();
 }
 
 /** 发送测试邮件 */
-function onSend(row: SystemMailTemplateApi.MailTemplate) {
+function handleSend(row: SystemMailTemplateApi.MailTemplate) {
   sendModalApi.setData(row).open();
 }
 
 /** 删除邮件模板 */
-async function onDelete(row: SystemMailTemplateApi.MailTemplate) {
+async function handleDelete(row: SystemMailTemplateApi.MailTemplate) {
   message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     duration: 0,
@@ -125,7 +125,7 @@ onMounted(async () => {
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:mail-template:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
           ]"
         />
@@ -138,14 +138,14 @@ onMounted(async () => {
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:mail-template:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: '测试',
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:mail-template:send-mail'],
-              onClick: onSend.bind(null, row),
+              onClick: handleSend.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -155,7 +155,7 @@ onMounted(async () => {
               auth: ['system:mail-template:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/mail/template/modules/send-form.vue

@@ -83,7 +83,7 @@ const [Modal, modalApi] = useVbenModal({
 });
 
 /** 动态构建表单 schema */
-const buildFormSchema = () => {
+function buildFormSchema() {
   const schema = useSendMailFormSchema();
   if (formData.value?.params) {
     formData.value.params?.forEach((param: string) => {
@@ -99,7 +99,7 @@ const buildFormSchema = () => {
     });
   }
   return schema;
-};
+}
 </script>
 
 <template>

apps/web-antd/src/views/system/menu/index.vue

@@ -29,32 +29,36 @@ function onRefresh() {
 }
 
 /** 创建菜单 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData({}).open();
 }
 
 /** 添加下级菜单 */
-function onAppend(row: SystemMenuApi.Menu) {
+function handleAppend(row: SystemMenuApi.Menu) {
   formModalApi.setData({ pid: row.id }).open();
 }
 
 /** 编辑菜单 */
-function onEdit(row: SystemMenuApi.Menu) {
+function handleEdit(row: SystemMenuApi.Menu) {
   formModalApi.setData(row).open();
 }
 
 /** 删除菜单 */
-async function onDelete(row: SystemMenuApi.Menu) {
+async function handleDelete(row: SystemMenuApi.Menu) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
+  try {
     await deleteMenu(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 /** 切换树形展开/收缩状态 */
@@ -115,7 +119,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:menu:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: isExpanded ? '收缩' : '展开',
@@ -151,14 +155,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.ADD,
               auth: ['system:menu:create'],
-              onClick: onAppend.bind(null, row),
+              onClick: handleAppend.bind(null, row),
             },
             {
               label: $t('common.edit'),
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:menu:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -168,7 +172,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:menu:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/notice/index.vue

@@ -24,40 +24,46 @@ function onRefresh() {
 }
 
 /** 创建公告 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑公告 */
-function onEdit(row: SystemNoticeApi.Notice) {
+function handleEdit(row: SystemNoticeApi.Notice) {
   formModalApi.setData(row).open();
 }
 
 /** 删除公告 */
-async function onDelete(row: SystemNoticeApi.Notice) {
+async function handleDelete(row: SystemNoticeApi.Notice) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.title]),
     key: 'action_key_msg',
   });
+  try {
     await deleteNotice(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.title]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 /** 推送公告 */
-async function onPush(row: SystemNoticeApi.Notice) {
+async function handlePush(row: SystemNoticeApi.Notice) {
   const hideLoading = message.loading({
     content: $t('ui.actionMessage.processing', ['推送']),
-    duration: 0,
     key: 'action_process_msg',
   });
   try {
     await pushNotice(row.id as number);
-    message.success($t('ui.actionMessage.operationSuccess'));
+    message.success({
-  } catch {
+      content: $t('ui.actionMessage.operationSuccess'),
+      key: 'action_key_msg',
+    });
+  } finally {
     hideLoading();
   }
 }
@@ -104,7 +110,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:notice:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
           ]"
         />
@@ -117,14 +123,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:notice:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: '推送',
               type: 'link',
               icon: ACTION_ICON.ADD,
               auth: ['system:notice:update'],
-              onClick: onPush.bind(null, row),
+              onClick: handlePush.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -134,7 +140,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:notice:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/notify/message/index.vue

@@ -22,7 +22,7 @@ function onRefresh() {
 }
 
 /** 查看站内信详情 */
-function onDetail(row: SystemNotifyMessageApi.NotifyMessage) {
+function handleDetail(row: SystemNotifyMessageApi.NotifyMessage) {
   detailModalApi.setData(row).open();
 }
 
@@ -72,7 +72,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.VIEW,
               auth: ['system:notify-message:query'],
-              onClick: onDetail.bind(null, row),
+              onClick: handleDetail.bind(null, row),
             },
           ]"
         />

apps/web-antd/src/views/system/notify/my/index.vue

@@ -28,12 +28,12 @@ function onRefresh() {
 }
 
 /** 查看站内信详情 */
-function onDetail(row: SystemNotifyMessageApi.NotifyMessage) {
+function handleDetail(row: SystemNotifyMessageApi.NotifyMessage) {
   detailModalApi.setData(row).open();
 }
 
 /** 标记一条站内信已读 */
-async function onRead(row: SystemNotifyMessageApi.NotifyMessage) {
+async function handleRead(row: SystemNotifyMessageApi.NotifyMessage) {
   message.loading({
     content: '正在标记已读...',
     duration: 0,
@@ -49,11 +49,11 @@ async function onRead(row: SystemNotifyMessageApi.NotifyMessage) {
   onRefresh();
 
   // 打开详情
-  onDetail(row);
+  handleDetail(row);
 }
 
 /** 标记选中的站内信为已读 */
-async function onMarkRead() {
+async function handleMarkRead() {
   const rows = gridApi.grid.getCheckboxRecords();
   if (!rows || rows.length === 0) {
     message.warning('请选择需要标记的站内信');
@@ -61,38 +61,44 @@ async function onMarkRead() {
   }
 
   const ids = rows.map((row: SystemNotifyMessageApi.NotifyMessage) => row.id);
-  message.loading({
+  const hideLoading = message.loading({
     content: '正在标记已读...',
-    duration: 0,
+    key: 'action_key_msg',
-    key: 'action_process_msg',
   });
+  try {
     // 执行标记已读操作
     await updateNotifyMessageRead(ids);
     // 提示成功
     message.success({
       content: '标记已读成功',
-    key: 'action_process_msg',
+      key: 'action_key_msg',
     });
     await gridApi.grid.setAllCheckboxRow(false);
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 /** 标记所有站内信为已读 */
-async function onMarkAllRead() {
+async function handleMarkAllRead() {
-  message.loading({
+  const hideLoading = message.loading({
     content: '正在标记全部已读...',
-    duration: 0,
+    key: 'action_key_msg',
-    key: 'action_process_msg',
   });
+  try {
     // 执行标记已读操作
     await updateAllNotifyMessageRead();
     // 提示成功
     message.success({
       content: '全部标记已读成功',
-    key: 'action_process_msg',
+      key: 'action_key_msg',
     });
     await gridApi.grid.setAllCheckboxRow(false);
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -144,13 +150,13 @@ const [Grid, gridApi] = useVbenVxeGrid({
               label: '标记已读',
               type: 'primary',
               icon: 'mdi:checkbox-marked-circle-outline',
-              onClick: onMarkRead,
+              onClick: handleMarkRead,
             },
             {
               label: '全部已读',
               type: 'primary',
               icon: 'mdi:checkbox-marked-circle-outline',
-              onClick: onMarkAllRead,
+              onClick: handleMarkAllRead,
             },
           ]"
         />
@@ -163,14 +169,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               ifShow: row.readStatus,
               icon: ACTION_ICON.VIEW,
-              onClick: onDetail.bind(null, row),
+              onClick: handleDetail.bind(null, row),
             },
             {
               label: '已读',
               type: 'link',
               ifShow: !row.readStatus,
               icon: ACTION_ICON.DELETE,
-              onClick: onRead.bind(null, row),
+              onClick: handleRead.bind(null, row),
             },
           ]"
         />

apps/web-antd/src/views/system/notify/template/index.vue

@@ -36,38 +36,42 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportNotifyTemplate(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '站内信模板.xls', source: data });
 }
 
 /** 创建站内信模板 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑站内信模板 */
-function onEdit(row: SystemNotifyTemplateApi.NotifyTemplate) {
+function handleEdit(row: SystemNotifyTemplateApi.NotifyTemplate) {
   formModalApi.setData(row).open();
 }
 
 /** 发送测试站内信 */
-function onSend(row: SystemNotifyTemplateApi.NotifyTemplate) {
+function handleSend(row: SystemNotifyTemplateApi.NotifyTemplate) {
   sendModalApi.setData(row).open();
 }
 
 /** 删除站内信模板 */
-async function onDelete(row: SystemNotifyTemplateApi.NotifyTemplate) {
+async function handleDelete(row: SystemNotifyTemplateApi.NotifyTemplate) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
+  try {
     await deleteNotifyTemplate(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -117,14 +121,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:notify-template:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: $t('ui.actionTitle.export'),
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:notify-template:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -137,14 +141,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:notify-template:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: '测试',
               type: 'link',
               icon: ACTION_ICON.ADD,
               auth: ['system:notify-template:send-notify'],
-              onClick: onSend.bind(null, row),
+              onClick: handleSend.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -154,7 +158,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:notify-template:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/notify/template/modules/send-form.vue

@@ -86,7 +86,7 @@ const [Modal, modalApi] = useVbenModal({
 });
 
 /** 动态构建表单 schema */
-const buildFormSchema = () => {
+function buildFormSchema() {
   const schema = useSendNotifyFormSchema();
   if (formData.value?.params) {
     formData.value.params.forEach((param: string) => {
@@ -102,7 +102,7 @@ const buildFormSchema = () => {
     });
   }
   return schema;
-};
+}
 </script>
 
 <template>

apps/web-antd/src/views/system/oauth2/client/index.vue

@@ -28,27 +28,31 @@ function onRefresh() {
 }
 
 /** 创建 OAuth2 客户端 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑 OAuth2 客户端 */
-function onEdit(row: SystemOAuth2ClientApi.OAuth2Client) {
+function handleEdit(row: SystemOAuth2ClientApi.OAuth2Client) {
   formModalApi.setData(row).open();
 }
 
 /** 删除 OAuth2 客户端 */
-async function onDelete(row: SystemOAuth2ClientApi.OAuth2Client) {
+async function handleDelete(row: SystemOAuth2ClientApi.OAuth2Client) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
+  try {
     await deleteOAuth2Client(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -100,7 +104,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:oauth2-client:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
           ]"
         />
@@ -113,7 +117,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:oauth2-client:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -123,7 +127,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:oauth2-client:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/oauth2/token/index.vue

@@ -22,17 +22,21 @@ function onRefresh() {
 }
 
 /** 删除 OAuth2 令牌 */
-async function onDelete(row: SystemOAuth2TokenApi.OAuth2Token) {
+async function handleDelete(row: SystemOAuth2TokenApi.OAuth2Token) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', ['令牌']),
     key: 'action_key_msg',
   });
+  try {
     await deleteOAuth2Token(row.accessToken);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', ['令牌']),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -86,7 +90,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:oauth2-token:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/operatelog/index.vue

@@ -24,13 +24,13 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportOperateLog(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '操作日志.xls', source: data });
 }
 
 /** 查看操作日志详情 */
-function onDetail(row: SystemOperateLogApi.OperateLog) {
+function handleDetail(row: SystemOperateLogApi.OperateLog) {
   detailModalApi.setData(row).open();
 }
 
@@ -80,7 +80,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:operate-log:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -93,7 +93,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.VIEW,
               auth: ['system:operate-log:query'],
-              onClick: onDetail.bind(null, row),
+              onClick: handleDetail.bind(null, row),
             },
           ]"
         />

apps/web-antd/src/views/system/post/index.vue

@@ -25,34 +25,37 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportPost(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '岗位.xls', source: data });
 }
 
 /** 创建岗位 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑岗位 */
-function onEdit(row: SystemPostApi.Post) {
+function handleEdit(row: SystemPostApi.Post) {
   formModalApi.setData(row).open();
 }
 
 /** 删除岗位 */
-async function onDelete(row: SystemPostApi.Post) {
+async function handleDelete(row: SystemPostApi.Post) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
-    duration: 0,
+    key: 'action_key_msg',
-    key: 'action_process_msg',
   });
+  try {
     await deletePost(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -97,14 +100,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:post:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: $t('ui.actionTitle.export'),
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:post:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -117,7 +120,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:post:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -127,7 +130,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:post:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/role/index.vue

@@ -39,43 +39,46 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportRole(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '角色.xls', source: data });
 }
 
 /** 编辑角色 */
-function onEdit(row: SystemRoleApi.Role) {
+function handleEdit(row: SystemRoleApi.Role) {
   formModalApi.setData(row).open();
 }
 
 /** 创建角色 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 删除角色 */
-// TODO @星语：要不要改成 handleXXX 风格？貌似看着更多项目是这么写的，不去改变大家的习惯。
+async function handleDelete(row: SystemRoleApi.Role) {
-async function onDelete(row: SystemRoleApi.Role) {
+  const hideLoading = message.loading({
-  message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
+  try {
     await deleteRole(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 /** 分配角色的数据权限 */
-function onAssignDataPermission(row: SystemRoleApi.Role) {
+function handleAssignDataPermission(row: SystemRoleApi.Role) {
   assignDataPermissionFormApi.setData(row).open();
 }
 
 /** 分配角色的菜单权限 */
-function onAssignMenu(row: SystemRoleApi.Role) {
+function handleAssignMenu(row: SystemRoleApi.Role) {
   assignMenuFormApi.setData(row).open();
 }
 
@@ -131,14 +134,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:role:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: $t('ui.actionTitle.export'),
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:role:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -151,7 +154,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:role:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -161,7 +164,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:role:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"
@@ -170,13 +173,13 @@ const [Grid, gridApi] = useVbenVxeGrid({
               label: '数据权限',
               type: 'link',
               auth: ['system:permission:assign-role-data-scope'],
-              onClick: onAssignDataPermission.bind(null, row),
+              onClick: handleAssignDataPermission.bind(null, row),
             },
             {
               label: '菜单权限',
               type: 'link',
               auth: ['system:permission:assign-role-menu'],
-              onClick: onAssignMenu.bind(null, row),
+              onClick: handleAssignMenu.bind(null, row),
             },
           ]"
         />

apps/web-antd/src/views/system/sms/channel/index.vue

@@ -30,34 +30,37 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportSmsChannel(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '短信渠道.xls', source: data });
 }
 
 /** 创建短信渠道 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑短信渠道 */
-function onEdit(row: SystemSmsChannelApi.SmsChannel) {
+function handleEdit(row: SystemSmsChannelApi.SmsChannel) {
   formModalApi.setData(row).open();
 }
 
 /** 删除短信渠道 */
-async function onDelete(row: SystemSmsChannelApi.SmsChannel) {
+async function handleDelete(row: SystemSmsChannelApi.SmsChannel) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.signature]),
-    duration: 0,
+    key: 'action_key_msg',
-    key: 'action_process_msg',
   });
+  try {
     await deleteSmsChannel(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.signature]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -106,14 +109,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:sms-channel:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: $t('ui.actionTitle.export'),
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:sms-channel:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -126,7 +129,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:sms-channel:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -136,7 +139,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:sms-channel:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/sms/log/index.vue

@@ -24,13 +24,13 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportSmsLog(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '短信日志.xls', source: data });
 }
 
 /** 查看短信日志详情 */
-function onDetail(row: SystemSmsLogApi.SmsLog) {
+function handleDetail(row: SystemSmsLogApi.SmsLog) {
   detailModalApi.setData(row).open();
 }
 
@@ -80,7 +80,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:sms-log:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -93,7 +93,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.VIEW,
               auth: ['system:sms-log:query'],
-              onClick: onDetail.bind(null, row),
+              onClick: handleDetail.bind(null, row),
             },
           ]"
         />

apps/web-antd/src/views/system/sms/template/index.vue

@@ -36,39 +36,42 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportSmsTemplate(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '短信模板.xls', source: data });
 }
 
 /** 创建短信模板 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑短信模板 */
-function onEdit(row: SystemSmsTemplateApi.SmsTemplate) {
+function handleEdit(row: SystemSmsTemplateApi.SmsTemplate) {
   formModalApi.setData(row).open();
 }
 
 /** 发送测试短信 */
-function onSend(row: SystemSmsTemplateApi.SmsTemplate) {
+function handleSend(row: SystemSmsTemplateApi.SmsTemplate) {
   sendModalApi.setData(row).open();
 }
 
 /** 删除短信模板 */
-async function onDelete(row: SystemSmsTemplateApi.SmsTemplate) {
+async function handleDelete(row: SystemSmsTemplateApi.SmsTemplate) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
-    duration: 0,
+    key: 'action_key_msg',
-    key: 'action_process_msg',
   });
+  try {
     await deleteSmsTemplate(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -118,14 +121,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:sms-template:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: $t('ui.actionTitle.export'),
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:sms-template:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -138,14 +141,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:sms-template:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: '发送短信',
               type: 'link',
               icon: ACTION_ICON.ADD,
               auth: ['system:sms-template:send-sms'],
-              onClick: onSend.bind(null, row),
+              onClick: handleSend.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -155,7 +158,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:sms-template:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/social/client/index.vue

@@ -28,27 +28,31 @@ function onRefresh() {
 }
 
 /** 创建社交客户端 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑社交客户端 */
-function onEdit(row: SystemSocialClientApi.SocialClient) {
+function handleEdit(row: SystemSocialClientApi.SocialClient) {
   formModalApi.setData(row).open();
 }
 
 /** 删除社交客户端 */
-async function onDelete(row: SystemSocialClientApi.SocialClient) {
+async function handleDelete(row: SystemSocialClientApi.SocialClient) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
+  try {
     await deleteSocialClient(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -97,7 +101,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:social-client:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
           ]"
         />
@@ -110,7 +114,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:social-client:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -120,7 +124,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:social-client:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/social/user/data.ts

@@ -1,13 +1,8 @@
 import type { VbenFormSchema } from '#/adapter/form';
-import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { SystemSocialUserApi } from '#/api/system/social/user';
-
-import { useAccess } from '@vben/access';
 
 import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
 
-const { hasAccessByCodes } = useAccess();
-
 /** 列表的搜索表单 */
 export function useGridFormSchema(): VbenFormSchema[] {
   return [
@@ -52,9 +47,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
 }
 
 /** 列表的字段 */
-export function useGridColumns<T = SystemSocialUserApi.SocialUser>(
+export function useGridColumns(): VxeTableGridOptions['columns'] {
-  onActionClick: OnActionClickFn<T>,
-): VxeTableGridOptions['columns'] {
   return [
     {
       field: 'type',
@@ -96,26 +89,10 @@ export function useGridColumns<T = SystemSocialUserApi.SocialUser>(
       formatter: 'formatDateTime',
     },
     {
-      field: 'operation',
       title: '操作',
-      minWidth: 100,
+      width: 80,
-      align: 'center',
       fixed: 'right',
-      cellRender: {
+      slots: { default: 'actions' },
-        attrs: {
-          nameField: 'nickname',
-          nameTitle: '社交用户',
-          onClick: onActionClick,
-        },
-        name: 'CellOperation',
-        options: [
-          {
-            code: 'detail',
-            text: '详情',
-            show: hasAccessByCodes(['system:social-user:query']),
-          },
-        ],
-      },
     },
   ];
 }

apps/web-antd/src/views/system/social/user/index.vue

@@ -1,13 +1,10 @@
 <script lang="ts" setup>
-import type {
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-  OnActionClickParams,
-  VxeTableGridOptions,
-} from '#/adapter/vxe-table';
 import type { SystemSocialUserApi } from '#/api/system/social/user';
 
 import { Page, useVbenModal } from '@vben/common-ui';
 
-import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getSocialUserPage } from '#/api/system/social/user';
 import { DocAlert } from '#/components/doc-alert';
 
@@ -20,29 +17,16 @@ const [DetailModal, detailModalApi] = useVbenModal({
 });
 
 /** 查看详情 */
-function onDetail(row: SystemSocialUserApi.SocialUser) {
+function handleDetail(row: SystemSocialUserApi.SocialUser) {
   detailModalApi.setData(row).open();
 }
 
-/** 表格操作按钮的回调函数 */
-function onActionClick({
-  code,
-  row,
-}: OnActionClickParams<SystemSocialUserApi.SocialUser>) {
-  switch (code) {
-    case 'detail': {
-      onDetail(row);
-      break;
-    }
-  }
-}
-
 const [Grid] = useVbenVxeGrid({
   formOptions: {
     schema: useGridFormSchema(),
   },
   gridOptions: {
-    columns: useGridColumns(onActionClick),
+    columns: useGridColumns(),
     height: 'auto',
     keepSource: true,
     proxyConfig: {
@@ -74,6 +58,20 @@ const [Grid] = useVbenVxeGrid({
     </template>
 
     <DetailModal />
-    <Grid table-title="社交用户列表" />
+    <Grid table-title="社交用户列表">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.detail'),
+              type: 'link',
+              icon: ACTION_ICON.VIEW,
+              auth: ['system:social-user:query'],
+              onClick: handleDetail.bind(null, row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
   </Page>
 </template>

apps/web-antd/src/views/system/tenant/index.vue

@@ -40,24 +40,24 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportTenant(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '租户.xls', source: data });
 }
 
 /** 创建租户 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑租户 */
-function onEdit(row: SystemTenantApi.Tenant) {
+function handleEdit(row: SystemTenantApi.Tenant) {
   formModalApi.setData(row).open();
 }
 
 /** 删除租户 */
-async function onDelete(row: SystemTenantApi.Tenant) {
+async function handleDelete(row: SystemTenantApi.Tenant) {
-  const loading = message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
@@ -69,8 +69,7 @@ async function onDelete(row: SystemTenantApi.Tenant) {
     });
     onRefresh();
   } finally {
-    // TODO @星语：测试了下，这样可以取消 loading；测试方式：1）先把数据库的数据，标记删除；2）点击界面，进行删除，loading 可以正确消失；
+    hideLoading();
-    loading();
   }
 }
 
@@ -122,14 +121,14 @@ onMounted(async () => {
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:tenant:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
             {
               label: $t('ui.actionTitle.export'),
               type: 'primary',
               icon: ACTION_ICON.DOWNLOAD,
               auth: ['system:tenant:export'],
-              onClick: onExport,
+              onClick: handleExport,
             },
           ]"
         />
@@ -142,7 +141,7 @@ onMounted(async () => {
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:role:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -152,7 +151,7 @@ onMounted(async () => {
               auth: ['system:role:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/tenantPackage/index.vue

@@ -28,27 +28,31 @@ function onRefresh() {
 }
 
 /** 创建租户套餐 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 编辑租户套餐 */
-function onEdit(row: SystemTenantPackageApi.TenantPackage) {
+function handleEdit(row: SystemTenantPackageApi.TenantPackage) {
   formModalApi.setData(row).open();
 }
 
 /** 删除租户套餐 */
-async function onDelete(row: SystemTenantPackageApi.TenantPackage) {
+async function handleDelete(row: SystemTenantPackageApi.TenantPackage) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     key: 'action_key_msg',
   });
+  try {
     await deleteTenantPackage(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -98,7 +102,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'primary',
               icon: ACTION_ICON.ADD,
               auth: ['system:tenant-package:create'],
-              onClick: onCreate,
+              onClick: handleCreate,
             },
           ]"
         />
@@ -111,7 +115,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               type: 'link',
               icon: ACTION_ICON.EDIT,
               auth: ['system:role:update'],
-              onClick: onEdit.bind(null, row),
+              onClick: handleEdit.bind(null, row),
             },
             {
               label: $t('common.delete'),
@@ -121,7 +125,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               auth: ['system:role:delete'],
               popConfirm: {
                 title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                confirm: onDelete.bind(null, row),
+                confirm: handleDelete.bind(null, row),
               },
             },
           ]"

apps/web-antd/src/views/system/user/index.vue

@@ -54,59 +54,64 @@ function onRefresh() {
 }
 
 /** 导出表格 */
-async function onExport() {
+async function handleExport() {
   const data = await exportUser(await gridApi.formApi.getValues());
   downloadFileFromBlobPart({ fileName: '用户.xls', source: data });
 }
 
 /** 选择部门 */
 const searchDeptId = ref<number | undefined>(undefined);
-async function onDeptSelect(dept: SystemDeptApi.Dept) {
+
+async function handleDeptSelect(dept: SystemDeptApi.Dept) {
   searchDeptId.value = dept.id;
   onRefresh();
 }
 
 /** 创建用户 */
-function onCreate() {
+function handleCreate() {
   formModalApi.setData(null).open();
 }
 
 /** 导入用户 */
-function onImport() {
+function handleImport() {
   importModalApi.open();
 }
 
 /** 编辑用户 */
-function onEdit(row: SystemUserApi.User) {
+function handleEdit(row: SystemUserApi.User) {
   formModalApi.setData(row).open();
 }
 
 /** 删除用户 */
-async function onDelete(row: SystemUserApi.User) {
+async function handleDelete(row: SystemUserApi.User) {
-  message.loading({
+  const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.username]),
     key: 'action_key_msg',
   });
+  try {
     await deleteUser(row.id as number);
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.username]),
       key: 'action_key_msg',
     });
     onRefresh();
+  } finally {
+    hideLoading();
+  }
 }
 
 /** 重置密码 */
-function onResetPassword(row: SystemUserApi.User) {
+function handleResetPassword(row: SystemUserApi.User) {
   resetPasswordModalApi.setData(row).open();
 }
 
 /** 分配角色 */
-function onAssignRole(row: SystemUserApi.User) {
+function handleAssignRole(row: SystemUserApi.User) {
   assignRoleModalApi.setData(row).open();
 }
 
 /** 更新用户状态 */
-async function onStatusChange(
+async function handleStatusChange(
   newStatus: number,
   row: SystemUserApi.User,
 ): Promise<boolean | undefined> {
@@ -136,7 +141,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     schema: useGridFormSchema(),
   },
   gridOptions: {
-    columns: useGridColumns(onStatusChange),
+    columns: useGridColumns(handleStatusChange),
     height: 'auto',
     keepSource: true,
     proxyConfig: {
@@ -181,7 +186,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     <div class="flex h-full w-full">
       <!-- 左侧部门树 -->
       <div class="h-full w-1/6 pr-4">
-        <DeptTree @select="onDeptSelect" />
+        <DeptTree @select="handleDeptSelect" />
       </div>
       <!-- 右侧用户列表 -->
       <div class="w-5/6">
@@ -194,21 +199,21 @@ const [Grid, gridApi] = useVbenVxeGrid({
                   type: 'primary',
                   icon: ACTION_ICON.ADD,
                   auth: ['system:user:create'],
-                  onClick: onCreate,
+                  onClick: handleCreate,
                 },
                 {
                   label: $t('ui.actionTitle.export'),
                   type: 'primary',
                   icon: ACTION_ICON.DOWNLOAD,
                   auth: ['system:user:export'],
-                  onClick: onExport,
+                  onClick: handleExport,
                 },
                 {
                   label: $t('ui.actionTitle.import', ['用户']),
                   type: 'primary',
                   icon: ACTION_ICON.UPLOAD,
                   auth: ['system:user:import'],
-                  onClick: onImport,
+                  onClick: handleImport,
                 },
               ]"
             />
@@ -221,7 +226,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
                   type: 'link',
                   icon: ACTION_ICON.EDIT,
                   auth: ['system:user:update'],
-                  onClick: onEdit.bind(null, row),
+                  onClick: handleEdit.bind(null, row),
                 },
                 {
                   label: $t('common.delete'),
@@ -231,7 +236,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
                   auth: ['system:user:delete'],
                   popConfirm: {
                     title: $t('ui.actionMessage.deleteConfirm', [row.name]),
-                    confirm: onDelete.bind(null, row),
+                    confirm: handleDelete.bind(null, row),
                   },
                 },
               ]"
@@ -240,13 +245,13 @@ const [Grid, gridApi] = useVbenVxeGrid({
                   label: '分配角色',
                   type: 'link',
                   auth: ['system:permission:assign-user-role'],
-                  onClick: onAssignRole.bind(null, row),
+                  onClick: handleAssignRole.bind(null, row),
                 },
                 {
                   label: '重置密码',
                   type: 'link',
                   auth: ['system:user:update-password'],
-                  onClick: onResetPassword.bind(null, row),
+                  onClick: handleResetPassword.bind(null, row),
                 },
               ]"
             />

apps/web-antd/src/views/system/user/modules/import-form.vue

@@ -55,7 +55,7 @@ function beforeUpload(file: FileType) {
 }
 
 /** 下载模版 */
-async function onDownload() {
+async function handleDownload() {
   const data = await importUserTemplate();
   downloadFileFromBlobPart({ fileName: '用户导入模板.xls', source: data });
 }
@@ -78,7 +78,7 @@ async function onDownload() {
     </Form>
     <template #prepend-footer>
       <div class="flex flex-auto items-center">
-        <Button @click="onDownload"> 下载导入模板 </Button>
+        <Button @click="handleDownload"> 下载导入模板 </Button>
       </div>
     </template>
   </Modal>