import { ref } from 'vue'; import type { Ref } from 'vue'; import { createFlatRequest } from '@sa/axios'; import type { AxiosError, CreateAxiosDefaults, CustomAxiosRequestConfig, MappedType, RequestOption, ResponseType } from '@sa/axios'; import useLoading from './use-loading'; export type HookRequestInstanceResponseSuccessData = { data: Ref; error: Ref; }; export type HookRequestInstanceResponseFailData = { data: Ref; error: Ref>; }; export type HookRequestInstanceResponseData = { loading: Ref; } & (HookRequestInstanceResponseSuccessData | HookRequestInstanceResponseFailData); export interface HookRequestInstance { ( config: CustomAxiosRequestConfig ): HookRequestInstanceResponseData, ResponseData>; cancelRequest: (requestId: string) => void; cancelAllRequest: () => void; } /** * create a hook request instance * * @param axiosConfig * @param options */ export default function createHookRequest( axiosConfig?: CreateAxiosDefaults, options?: Partial> ) { const request = createFlatRequest(axiosConfig, options); const hookRequest: HookRequestInstance = function hookRequest( config: CustomAxiosRequestConfig ) { const { loading, startLoading, endLoading } = useLoading(); const data = ref | null>(null) as Ref>; const error = ref | null>(null) as Ref | null>; startLoading(); request(config).then(res => { if (res.data) { data.value = res.data; } else { error.value = res.error; } endLoading(); }); return { loading, data, error }; } as HookRequestInstance; hookRequest.cancelRequest = request.cancelRequest; hookRequest.cancelAllRequest = request.cancelAllRequest; return hookRequest; }