Skip to content

赵月辉 / fastgpt-migrated

Go to a project
Commit 451f234f by archer
Options

perf: ssr and iphone daapt

parent 1ab45651
Showing with 68 additions and 34 deletions
src/components/Layout/index.tsx
import React, { useEffect, useMemo } from 'react';
import { Box, useColorMode, Flex } from '@chakra-ui/react';
import Navbar from './navbar';
import NavbarPhone from './navbarPhone';
import { useRouter } from 'next/router';
import { useScreen } from '@/hooks/useScreen';
import { useLoading } from '@/hooks/useLoading';
import Auth from './auth';
import { useGlobalStore } from '@/store/global';
import Auth from './auth';
import Navbar from './navbar';
import NavbarPhone from './navbarPhone';
const pcUnShowLayoutRoute: Record<string, boolean> = {
'/login': true
......
src/components/Loading/index.tsx 0 → 100644
import React from 'react';
import { Spinner, Flex } from '@chakra-ui/react';
const Loading = ({ fixed = true }: { fixed?: boolean }) => {
return (
<Flex
position={fixed ? 'fixed' : 'absolute'}
zIndex={100}
backgroundColor={'rgba(255,255,255,0.5)'}
top={0}
left={0}
right={0}
bottom={0}
alignItems={'center'}
justifyContent={'center'}
>
<Spinner thickness="4px" speed="0.65s" emptyColor="gray.200" color="myBlue.500" size="xl" />
</Flex>
);
};
export default Loading;
src/hooks/useLoading.tsx
import { useState, useCallback } from 'react';
import { Spinner, Flex } from '@chakra-ui/react';
import LoadingComponent from '@/components/Loading';
export const useLoading = (props?: { defaultLoading: boolean }) => {
const [isLoading, setIsLoading] = useState(props?.defaultLoading || false);
const Loading = useCallback(
({ loading, fixed = true }: { loading?: boolean; fixed?: boolean }): JSX.Element | null => {
return isLoading || loading ? (
<Flex
position={fixed ? 'fixed' : 'absolute'}
zIndex={100}
backgroundColor={'rgba(255,255,255,0.5)'}
top={0}
left={0}
right={0}
bottom={0}
alignItems={'center'}
justifyContent={'center'}
>
<Spinner
thickness="4px"
speed="0.65s"
emptyColor="gray.200"
color="myBlue.500"
size="xl"
/>
</Flex>
) : null;
return isLoading || loading ? <LoadingComponent fixed={fixed} /> : null;
},
[isLoading]
);
......
src/pages/_app.tsx
......@@ -45,9 +45,10 @@ export default function App({ Component, pageProps }: AppProps) {
<Head>
<title>Fast GPT</title>
<meta name="description" content="Generated by Fast GPT" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no, viewport-fit=cover"
/>
<link rel="icon" href="/favicon.ico" />
</Head>
......
src/pages/chat/index.tsx
......@@ -44,10 +44,20 @@ import { useLoading } from '@/hooks/useLoading';
import { fileDownload } from '@/utils/file';
import { htmlTemplate } from '@/constants/common';
import { useUserStore } from '@/store/user';
const PhoneSliderBar = dynamic(() => import('./components/PhoneSliderBar'));
const History = dynamic(() => import('./components/History'));
const Empty = dynamic(() => import('./components/Empty'));
import Loading from '@/components/Loading';
const PhoneSliderBar = dynamic(() => import('./components/PhoneSliderBar'), {
loading: () => <Loading fixed={false} />,
ssr: false
});
const History = dynamic(() => import('./components/History'), {
loading: () => <Loading fixed={false} />,
ssr: false
});
const Empty = dynamic(() => import('./components/Empty'), {
loading: () => <Loading fixed={false} />,
ssr: false
});
import styles from './index.module.scss';
......
src/pages/model/index.tsx
......@@ -5,8 +5,12 @@ import { useRouter } from 'next/router';
import ModelList from './components/ModelList';
import dynamic from 'next/dynamic';
import { useUserStore } from '@/store/user';
import Loading from '@/components/Loading';
const ModelDetail = dynamic(() => import('./components/detail/index'));
const ModelDetail = dynamic(() => import('./components/detail/index'), {
loading: () => <Loading fixed={false} />,
ssr: false
});
const Model = ({ modelId, isPcDevice }: { modelId: string; isPcDevice: boolean }) => {
const router = useRouter();
......
src/pages/number/index.tsx
......@@ -13,10 +13,20 @@ import { useQuery } from '@tanstack/react-query';
import dynamic from 'next/dynamic';
import { useSelectFile } from '@/hooks/useSelectFile';
import { compressImg } from '@/utils/file';
import Loading from '@/components/Loading';
const PayRecordTable = dynamic(() => import('./components/PayRecordTable'));
const BilTable = dynamic(() => import('./components/BillTable'));
const PayModal = dynamic(() => import('./components/PayModal'));
const PayRecordTable = dynamic(() => import('./components/PayRecordTable'), {
loading: () => <Loading fixed={false} />,
ssr: false
});
const BilTable = dynamic(() => import('./components/BillTable'), {
loading: () => <Loading fixed={false} />,
ssr: false
});
const PayModal = dynamic(() => import('./components/PayModal'), {
loading: () => <Loading fixed={false} />,
ssr: false
});
const NumberSetting = () => {
const router = useRouter();
......
src/styles/reset.scss
......@@ -87,6 +87,13 @@ textarea::placeholder {
}
}
@supports (bottom: constant(safe-area-inset-bottom)) or (bottom: env(safe-area-inset-bottom)) {
body {
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
}
#nprogress .bar {
background: '#85b1ff' !important; //自定义颜色
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment