feat(stock): 为工具栏添加刷新功能并优化类型定义

为 `vxe-toolbar` 添加了刷新功能,通过 `queryMethod` 方法实现数据同步。同时优化了 `toolbarRef` 和 `tableRef` 的类型定义,移除了未使用的 `toolClickEvent` 方法。
This commit is contained in:
user 2025-03-23 23:38:41 +08:00
parent ccbd16e913
commit 4c87eaa302
2 changed files with 9 additions and 15 deletions

View File

@ -4,7 +4,7 @@ import { useRouter } from 'vue-router';
import { useAlertService } from '@/shared/alert/alert.service';
import buildPaginationQuery from '@/shared/sort/sorts';
import axios from 'axios';
import type { VxePagerEvents } from 'vxe-table';
import type { VxeToolbarInstance, VxeTableInstance, VxePagerEvents } from 'vxe-table';
export default defineComponent({
compatConfig: { MODE: 3 },
@ -13,8 +13,8 @@ export default defineComponent({
const { t: $t } = useI18n();
const alertService = useAlertService();
const router = useRouter();
const tableRef = ref(null);
const toolbarRef = ref(null);
const toolbarRef = ref<VxeToolbarInstance>();
const tableRef = ref<VxeTableInstance>();
const isFetching = ref(false);
const stocks = ref([]);
@ -31,13 +31,6 @@ export default defineComponent({
pageSize: 10,
});
const toolClickEvent: VxeToolbarEvents.ButtonClick = ({ code }) => {
VxeUI.modal.message({
content: `点击了 ${code}`,
status: 'success',
});
};
// 过滤参数
const filterParams = ref({
number: { op: '=', value: null },
@ -174,12 +167,9 @@ export default defineComponent({
watch([tableRef, toolbarRef], ([table, toolbar]) => {
if (table && toolbar) {
table.connect(toolbar);
console.log('Table and Toolbar connected successfully!');
}
});
handleSyncList();
const prepareDelete = row => {
removeRow.value = { ...row };
if (deleteDialog.value) deleteDialog.value.show();
@ -203,6 +193,10 @@ export default defineComponent({
handleSyncList();
};
const queryMethod = () => {
handleSyncList();
};
handleSyncList();
return {
@ -224,9 +218,9 @@ export default defineComponent({
statusDicts,
tableRef,
toolbarRef,
toolClickEvent,
pageChange,
clearInput,
queryMethod,
};
},
});

View File

@ -1,6 +1,6 @@
<template>
<div>
<vxe-toolbar ref="toolbarRef" import export print custom>
<vxe-toolbar ref="toolbarRef" import export print custom :refresh="{ queryMethod }">
<template #buttonPrefix>
<h5 class="jh-entity-heading">
<font-awesome-icon icon="warehouse" />