import { Ref } from 'vue'; /** * 选项数据类型(统一返回格式) */ export interface MappedOption> { /** 显示文本 */ label: string; /** 选项值 */ value: string | number; /** 原始数据 */ rawData: T; /** 索引签名(兼容 SelectOption) */ [key: string]: unknown; } /** * 数据转换配置 */ export interface TransformConfig { /** * label 映射 * - string: 字段名 * - function: 自定义格式化函数 */ label: keyof T | ((item: T) => string); /** * value 映射 * - string: 字段名 * - function: 自定义格式化函数 */ value: keyof T | ((item: T) => string | number); } /** * API 响应类型(通用) */ export interface ApiResponseLike { data?: { result?: T[]; total?: number; }; code?: string; } /** * 加载更多参数(内部使用) */ interface LoadMoreParamsInternal { page: number; pageSize: number; keyword?: string; } /** * 加载更多结果(内部使用) */ interface LoadMoreResultInternal { list: MappedOption[]; total: number; hasMore: boolean; } /** * 加载更多函数类型(内部使用) */ type LoadMoreFunctionInternal = (params: LoadMoreParamsInternal) => Promise; /** * Hook 配置项 */ export interface UseSelectWithMappingConfig> { /** * API 调用函数 * @param params 请求参数 * @returns Promise */ apiFn: (params: { keyword: string; pageSize: number; offset: number; }) => Promise>; /** * 数据转换配置(label/value 映射) */ transform: TransformConfig; /** * 响应数据路径配置 */ dataPath?: { /** 列表数据路径,默认 'result' (相对于 data) */ list?: string; /** 总数路径,默认 'total' (相对于 data) */ total?: string; }; /** * 是否在无关键词时返回空列表 * @default true */ requireKeyword?: boolean; } /** * Hook 返回值 */ export interface UseSelectWithMappingReturn> { /** 分页加载函数(用于 YcSelectV2 组件) */ loadMore: LoadMoreFunctionInternal; /** 数据映射(通过 value 查找原始数据) */ dataMap: Ref>>; /** 根据 value 获取原始数据 */ getRawData: (value: string | number) => T | undefined; /** 根据 value 获取完整选项 */ getOption: (value: string | number) => MappedOption | undefined; /** 清空数据映射 */ clearDataMap: () => void; /** 加载状态 */ loading: Ref; } /** * 通用分页选择器 Hook(带数据映射) * * @description 封装分页搜索 API 调用逻辑,支持自定义 label/value 映射 * 统一返回 { label, value, rawData } 格式给下拉组件使用 * * @param config 配置项 * @returns 返回 loadMore 函数和数据映射 * * @example * ```ts * // 基础用法:使用字段名映射 * const { loadMore, getRawData } = useSelectWithMapping({ * apiFn: ({ keyword, pageSize, offset }) => * mySearchApi(keyword, pageSize, offset), * transform: { * label: 'name', // 使用 name 字段作为 label * value: 'id' // 使用 id 字段作为 value * } * }); * ``` * * @example * ```ts * // 高级用法:使用函数自定义格式 * const { loadMore, getRawData } = useSelectWithMapping({ * apiFn: ({ keyword, pageSize, offset }) => * searchApi(keyword, pageSize, offset), * transform: { * label: (item) => `${item.name} (${item.code})`, * value: (item) => item.id * } * }); * ``` */ export declare function useSelectWithMapping>(config: UseSelectWithMappingConfig): UseSelectWithMappingReturn; export {};