Composables

可复用组合逻辑在 admin/src/hooks/。下列导出名称均来自源码文件。

一览

导出	文件	用途
useListPage	useListPage.ts	列表页：分页、搜索、删除、批量删除、状态切换
usePaging	usePaging.ts	更底层的分页加载（pager + getLists）
useFormDialog	useFormDialog.ts	新增/编辑弹窗：visible、表单、提交
useDictOptions	useDictOptions.ts	批量拉字典/下拉选项
useDebounceRequest	useDebounceRequest.ts	异步请求防抖（默认 300ms）
useLockFn	useLockFn.ts	异步锁，防止重复提交
useWatchRoute	useWatchRoute.ts	路由变化时立即并持续回调
useRealtimeFallbackPolling	useRealtimeFallbackPolling.ts	实时通道断开时回退轮询
useMultipleTabs（default）	useMultipleTabs.ts	多标签增删与当前 tab

常用模式

列表页 — 传入 fetchFn 与可选 deleteFn / batchDeleteFn / updateStatusFn：

const { list, loading, pagination, searchForm, getList, resetSearch, handleDelete } = useListPage({
  fetchFn: (params) => someApi.getList(params),
  deleteFn: (id) => someApi.remove(id),
  defaultSearchForm: { keyword: '', status: '' },
})

内部用 page / limit，并从 res.data.list、res.data.pagination.total 取值。

分页钩子 — usePaging({ fetchFun, params, size }) 返回 pager、getLists、resetPage、resetParams。

表单弹窗 — useFormDialog 根据表单是否带 id 走 createFn / updateFn，处理校验与成功提示。

多标签 — useMultipleTabs 依赖 openMultipleTabs 设置与 multipleTabs store；布局顶栏使用它驱动标签列表。

写新列表页时优先 useListPage；已有复杂自定义分页再落到 usePaging。不要在 hook 里写死业务 API 路径，由调用方注入函数。