Files
vue3-element-admin/src/hooks/usePage.ts
2024-04-27 20:22:23 +08:00

59 lines
1.6 KiB
TypeScript

import { ref } from "vue";
import type PageSearch from "@/components/PageSearch/index.vue";
import type PageContent from "@/components/PageContent/index.vue";
import type PageModal from "@/components/PageModal/index.vue";
import type { IOperatData, IObject } from "@/components/PageContent/index.vue";
export type { IOperatData, IObject };
function usePage() {
const searchRef = ref<InstanceType<typeof PageSearch>>();
const contentRef = ref<InstanceType<typeof PageContent>>();
const addModalRef = ref<InstanceType<typeof PageModal>>();
const editModalRef = ref<InstanceType<typeof PageModal>>();
// 搜索
function handleQueryClick(queryParams: IObject) {
contentRef.value?.fetchPageData(queryParams, true);
}
// 重置
function handleResetClick() {
contentRef.value?.fetchPageData({}, true);
}
// 新增
function handleAddClick() {
//显示添加表单
addModalRef.value?.setModalVisible();
}
// 编辑
function handleEditClick(row: IObject) {
//显示编辑表单 根据数据进行填充
editModalRef.value?.setModalVisible(row);
}
// 表单提交
function handleSubmitClick() {
//刷新列表数据
contentRef.value?.fetchPageData({}, true);
}
// 导出
function handleExportClick() {
// 根据检索条件导出数据
const queryParams = searchRef.value?.getQueryParams();
contentRef.value?.exportPageData(queryParams);
}
return {
searchRef,
contentRef,
addModalRef,
editModalRef,
handleQueryClick,
handleResetClick,
handleAddClick,
handleEditClick,
handleSubmitClick,
handleExportClick,
};
}
export default usePage;