feat: new ui

src/hooks/useConfirm.tsx

@@ -39,7 +39,7 @@ export const useConfirm = ({ title = '提示', content }: { title?: string; cont
 
               <AlertDialogFooter>
                 <Button
-                  colorScheme={'gray'}
+                  variant={'outline'}
                   onClick={() => {
                     onClose();
                     typeof cancelCb.current === 'function' && cancelCb.current();
@@ -48,7 +48,6 @@ export const useConfirm = ({ title = '提示', content }: { title?: string; cont
                   取消
                 </Button>
                 <Button
-                  colorScheme="blue"
                   ml={4}
                   onClick={() => {
                     onClose();

src/hooks/useLoading.tsx

@@ -18,7 +18,13 @@ export const useLoading = (props?: { defaultLoading: boolean }) => {
           alignItems={'center'}
           justifyContent={'center'}
         >
-          <Spinner thickness="4px" speed="0.65s" emptyColor="gray.200" color="blue.500" size="xl" />
+          <Spinner
+            thickness="4px"
+            speed="0.65s"
+            emptyColor="gray.200"
+            color="myBlue.500"
+            size="xl"
+          />
         </Flex>
       ) : null;
     },

src/hooks/usePagination.tsx

@@ -4,15 +4,18 @@ import { IconButton, Flex, Box, Input } from '@chakra-ui/react';
 import { ArrowBackIcon, ArrowForwardIcon } from '@chakra-ui/icons';
 import { useMutation } from '@tanstack/react-query';
 import { useToast } from './useToast';
+import { useQuery } from '@tanstack/react-query';
 
 export const usePagination = <T = any,>({
   api,
   pageSize = 10,
-  params = {}
+  params = {},
+  defaultRequest = true
 }: {
   api: (data: any) => any;
   pageSize?: number;
   params?: Record<string, any>;
+  defaultRequest?: boolean;
 }) => {
   const { toast } = useToast();
   const [pageNum, setPageNum] = useState(1);
@@ -90,7 +93,7 @@ export const usePagination = <T = any,>({
   }, [maxPage, mutate, pageNum]);
 
   useEffect(() => {
-    mutate(1);
+    defaultRequest && mutate(1);
   }, []);
 
   return {

src/hooks/useScreen.ts

@@ -1,10 +1,15 @@
 import { useMemo } from 'react';
 import { useMediaQuery } from '@chakra-ui/react';
 
-export function useScreen() {
+interface Props {
+  defaultIsPc?: boolean;
+}
+
+export function useScreen(data?: Props) {
+  const { defaultIsPc = false } = data || {};
   const [isPc] = useMediaQuery('(min-width: 900px)', {
     ssr: true,
-    fallback: false
+    fallback: defaultIsPc
   });
 
   return {