feat: 训练数据管理

src/hooks/useConfirm.tsx

@@ -19,9 +19,10 @@ export const useConfirm = ({ title = '提示', content }: { title?: string; cont
   return {
     openConfirm: useCallback(
       (confirm?: any, cancel?: any) => {
-        onOpen();
         confirmCb.current = confirm;
         cancelCb.current = cancel;
+
+        return onOpen;
       },
       [onOpen]
     ),

src/hooks/usePaging.ts

@@ -1,16 +1,18 @@
 import { useState, useCallback } from 'react';
 import type { PagingData } from '../types/index';
 import { useQuery } from '@tanstack/react-query';
+import { useToast } from './useToast';
 
 export const usePaging = <T = any>({
   api,
   pageSize = 10,
-  params
+  params = {}
 }: {
   api: (data: any) => Promise<PagingData<T>>;
   pageSize?: number;
   params?: Record<string, any>;
 }) => {
+  const { toast } = useToast();
   const [data, setData] = useState<T[]>([]);
   const [pageNum, setPageNum] = useState(1);
   const [total, setTotal] = useState(0);
@@ -18,36 +20,40 @@ export const usePaging = <T = any>({
   const [requesting, setRequesting] = useState(false);
 
   const getData = useCallback(
-    async (init = false) => {
+    async (num: number, init = false) => {
       if (requesting) return;
       if (!init && isLoadAll) return;
       setRequesting(true);
 
       try {
         const res = await api({
-          pageNum,
+          pageNum: num,
           pageSize,
-          ...(params ? params : {})
+          ...params
         });
         setData((state) => {
           const data = init ? res.data : state.concat(res.data);
           if (data.length >= res.total) {
             setIsLoadAll(true);
           }
+          setTotal(res.total);
           return data;
         });
-        setTotal(res.total);
-      } catch (error) {
+      } catch (error: any) {
+        toast({
+          title: error?.message || '获取数据异常',
+          status: 'error'
+        });
         console.log(error);
       }
 
       setRequesting(false);
       return null;
     },
-    [api, isLoadAll, pageNum, pageSize, params, requesting]
+    [api, isLoadAll, pageSize, params, requesting, toast]
   );
 
-  useQuery(['init', pageNum], () => getData(pageNum === 1));
+  useQuery(['init', pageNum], () => getData(pageNum, pageNum === 1));
 
   return {
     pageNum,
@@ -55,6 +61,7 @@ export const usePaging = <T = any>({
     setPageNum,
     total,
     data,
-    getData
+    getData,
+    requesting
   };
 };

src/hooks/useSelectFile.tsx

@@ -0,0 +1,34 @@
+import React, { useRef, useCallback } from 'react';
+import { Box } from '@chakra-ui/react';
+
+export const useSelectFile = (props?: { fileType?: string; multiple?: boolean }) => {
+  const { fileType = '*', multiple = false } = props || {};
+  const SelectFileDom = useRef<HTMLInputElement>(null);
+
+  const File = useCallback(
+    ({ onSelect }: { onSelect: (e: File[]) => void }) => (
+      <Box position={'absolute'} w={0} h={0} overflow={'hidden'}>
+        <input
+          ref={SelectFileDom}
+          type="file"
+          accept={fileType}
+          multiple={multiple}
+          onChange={(e) => {
+            if (!e.target.files || e.target.files?.length === 0) return;
+            onSelect(Array.from(e.target.files));
+          }}
+        />
+      </Box>
+    ),
+    [fileType, multiple]
+  );
+
+  const onOpen = useCallback(() => {
+    SelectFileDom.current && SelectFileDom.current.click();
+  }, []);
+
+  return {
+    File,
+    onOpen
+  };
+};

src/hooks/useTabs.tsx

@@ -0,0 +1,18 @@
+import React, { useState, useCallback, useRef } from 'react';
+
+export const useTabs = ({
+  tabs = []
+}: {
+  tabs: {
+    id: string;
+    label: string;
+  }[];
+}) => {
+  const [activeTab, setActiveTab] = useState(tabs[0].id);
+
+  return {
+    tabs,
+    activeTab,
+    setActiveTab
+  };
+};