gpu alias

frontend/providers/applaunchpad/public/locales/zh/common.json

@@ -1,7 +1,7 @@
 {
   "cpu": "CPU",
   "memory": "内存",
-  "storage": "存储券",
+  "storage": "存储卷",
   "gpu": "GPU",
   "Applications": "应用列表",
   "Create Application": "新建应用",

frontend/providers/applaunchpad/src/components/GPUItem/index.tsx

@@ -1,29 +1,38 @@
 import { Box, Flex } from '@chakra-ui/react';
-import React from 'react';
+import React, { useMemo } from 'react';
 import MyIcon from '../Icon';
 import { GpuType } from '@/types/app';
 import { useTranslation } from 'next-i18next';
+import { useUserStore } from '@/store/user';
 
 const GPUItem = ({ gpu }: { gpu?: GpuType }) => {
   const { t } = useTranslation();
+  const { userSourcePrice } = useUserStore();
+
+  const gpuAlias = useMemo(() => {
+    const gpuItem = userSourcePrice?.gpu?.find((item) => item.type === gpu?.type);
+
+    return gpuItem?.alias || gpu?.type || '';
+  }, [gpu?.type, userSourcePrice?.gpu]);
+
   return (
     <Flex whiteSpace={'nowrap'}>
       <MyIcon name={'nvidia'} w={'16px'} mr={2} />
-      {gpu?.type && (
+      {gpuAlias && (
         <>
-          <Box>{gpu.type}</Box>
+          <Box>{gpuAlias}</Box>
           <Box mx={1} color={'myGray.400'}>
             /
           </Box>
         </>
       )}
       <Box color={!!gpu?.amount ? 'myGray.600' : 'myGray.400'}>
-        {!!gpu?.type ? gpu?.amount : 0}
+        {!!gpuAlias ? gpu?.amount : 0}
 
         {t('Card')}
       </Box>
     </Flex>
   );
 };
 
-export default GPUItem;
+export default React.memo(GPUItem);

frontend/providers/applaunchpad/src/pages/_app.tsx

@@ -16,6 +16,7 @@ import { loadInitData } from '@/store/static';
 import { useRouter } from 'next/router';
 import { appWithTranslation, useTranslation } from 'next-i18next';
 import { getLangStore, setLangStore } from '@/utils/cookieUtils';
+import { useUserStore } from '@/store/user';
 
 import 'nprogress/nprogress.css';
 import '@/styles/reset.scss';
@@ -40,6 +41,7 @@ const App = ({ Component, pageProps }: AppProps) => {
   const router = useRouter();
   const { i18n } = useTranslation();
   const { setScreenWidth, loading, setLastRoute, initFormSliderList } = useGlobalStore();
+  const { loadUserSourcePrice } = useUserStore();
   const { Loading } = useLoading();
   const [refresh, setRefresh] = useState(false);
   const { openConfirm, ConfirmChild } = useConfirm({
@@ -55,6 +57,7 @@ const App = ({ Component, pageProps }: AppProps) => {
     (async () => {
       const { SEALOS_DOMAIN, FORM_SLIDER_LIST_CONFIG } = await (() => loadInitData())();
       initFormSliderList(FORM_SLIDER_LIST_CONFIG);
+      loadUserSourcePrice();
 
       try {
         const res = await sealosApp.getSession();
@@ -74,7 +77,7 @@ const App = ({ Component, pageProps }: AppProps) => {
     NProgress.done();
 
     return response;
-  }, [initFormSliderList, openConfirm]);
+  }, []);
 
   // add resize event
   useEffect(() => {

frontend/providers/applaunchpad/src/pages/api/platform/resourcePrice.ts

@@ -179,22 +179,5 @@ function countGpuSource(rawData: PriceCrdType, gpuNodes: GpuNodeType[]) {
     });
   });
 
-  return gpuList.length === 0
-    ? [
-        {
-          alias: 'Tesla-P40',
-          type: 'Tesla-P40',
-          price: 0.82,
-          inventory: 11,
-          vm: 24
-        },
-        {
-          alias: '4090',
-          type: 'NVIDIA-GeForce-RTX-4090',
-          price: 0.82,
-          inventory: 1,
-          vm: 23.98828125
-        }
-      ]
-    : gpuList;
+  return gpuList.length === 0 ? undefined : gpuList;
 }

frontend/providers/applaunchpad/src/pages/app/edit/components/Form.tsx

@@ -226,12 +226,12 @@ const Form = ({
               icon: 'nvidia',
               label: (
                 <Flex>
-                  <Box color={'myGray.900'}>{item.type}</Box>
+                  <Box color={'myGray.900'}>{item.alias}</Box>
                   <Box mx={3} color={'myGray.500'}>
                     |
                   </Box>
                   <Box color={'myGray.500'}>
-                    {t('vm')} : {item.vm}G
+                    {t('vm')} : {Math.round(item.vm)}G
                   </Box>
                   <Box mx={3} color={'myGray.500'}>
                     |

frontend/providers/applaunchpad/src/pages/app/edit/index.tsx

@@ -265,7 +265,6 @@ const EditApp = ({ appName, tabType }: { appName?: string; tabType: string }) =>
       },
       onSettled() {
         setIsLoading(false);
-        refetchPrice();
       }
     }
   );