fix qrcode script (#3520)

* fix qrcode script

* i18n

packages/web/i18n/en/common.json

@@ -1037,13 +1037,15 @@
   "support.user.Price": "Pricing",
   "support.user.User self info": "Profile",
   "support.user.auth.Sending Code": "Sending Code",
+  "support.user.auth.get_code": "Get Verification Code",
+  "support.user.auth.get_code_again": "s Get Again",
   "support.user.captcha_placeholder": "Please enter the verification code",
-  "support.user.info.notification_receiving_hint": "Notification reception",
-  "support.user.info.bind_notification_hint": "Please bind the notification receiving account to ensure that you can receive notifications such as package expiration reminders, etc., to ensure the normal operation of your service.",
-  "support.user.info.verification_code": "Verification Code",
-  "support.user.info.code_required": "Verification code cannot be empty",
   "support.user.info.bind_notification_error": "Abnormal binding notification account",
+  "support.user.info.bind_notification_hint": "Please bind the notification receiving account to ensure that you can receive notifications such as package expiration reminders, etc., to ensure the normal operation of your service.",
   "support.user.info.bind_notification_success": "Binding notification account successful",
+  "support.user.info.code_required": "Verification code cannot be empty",
+  "support.user.info.notification_receiving_hint": "Notification reception",
+  "support.user.info.verification_code": "Verification Code",
   "support.user.inform.System message": "System Message",
   "support.user.login.Email": "Email",
   "support.user.login.Github": "GitHub Login",

packages/web/i18n/en/user.json

@@ -37,8 +37,6 @@
   "password.confirm": "Confirm Password",
   "password.email_phone_error": "Invalid Email/Phone Number Format",
   "password.email_phone_void": "Email/Phone Number Cannot Be Empty",
-  "password.get_code": "Get Verification Code",
-  "password.get_code_again": "Get Again in s",
   "password.not_match": "Passwords Do Not Match",
   "password.password_condition": "Password must be between 4 and 20 characters",
   "password.password_required": "Password Cannot Be Empty",

packages/web/i18n/zh-CN/common.json

@@ -1040,14 +1040,16 @@
   "support.user.Price": "计费标准",
   "support.user.User self info": "个人信息",
   "support.user.auth.Sending Code": "正在发送",
+  "support.user.auth.get_code": "获取验证码",
+  "support.user.auth.get_code_again": "s后重新获取",
   "support.user.captcha_placeholder": "请输入验证码",
-  "support.user.inform.System message": "系统消息",
-  "support.user.info.notification_receiving_hint": "通知接收",
-  "support.user.info.bind_notification_hint": "请绑定通知接收账号，以确保您能正常接收套餐过期提醒等通知，保障您的服务正常运行。",
-  "support.user.info.verification_code": "验证码",
-  "support.user.info.code_required": "验证码不能为空",
-  "support.user.info.bind_notification_success": "绑定通知账号成功",
   "support.user.info.bind_notification_error": "绑定通知账号异常",
+  "support.user.info.bind_notification_hint": "请绑定通知接收账号，以确保您能正常接收套餐过期提醒等通知，保障您的服务正常运行。",
+  "support.user.info.bind_notification_success": "绑定通知账号成功",
+  "support.user.info.code_required": "验证码不能为空",
+  "support.user.info.notification_receiving_hint": "通知接收",
+  "support.user.info.verification_code": "验证码",
+  "support.user.inform.System message": "系统消息",
   "support.user.login.Email": "邮箱",
   "support.user.login.Github": "GitHub 登录",
   "support.user.login.Google": "Google 登录",

packages/web/i18n/zh-CN/user.json

@@ -37,8 +37,6 @@
   "password.confirm": "确认密码",
   "password.email_phone_error": "邮箱/手机号格式错误",
   "password.email_phone_void": "邮箱/手机号不能为空",
-  "password.get_code": "获取验证码",
-  "password.get_code_again": "s后重新获取",
   "password.not_match": "两次密码不一致",
   "password.password_condition": "密码最少 4 位最多 20 位",
   "password.password_required": "密码不能为空",

packages/web/i18n/zh-Hant/common.json

@@ -1037,14 +1037,16 @@
   "support.user.Price": "計費標準",
   "support.user.User self info": "個人資訊",
   "support.user.auth.Sending Code": "正在傳送驗證碼",
+  "support.user.auth.get_code": "取得驗證碼",
+  "support.user.auth.get_code_again": "秒後重新取得",
   "support.user.captcha_placeholder": "請輸入驗證碼",
-  "support.user.inform.System message": "系統訊息",
-  "support.user.info.notification_receiving_hint": "通知接收",
-  "support.user.info.bind_notification_hint": "請綁定通知接收帳號，確保您能正常接收套餐過期提醒等通知，保障您的服務正常運作。",
-  "support.user.info.verification_code": "驗證碼",
-  "support.user.info.code_required": "驗證碼不能為空",
-  "support.user.info.bind_notification_success": "綁定通知帳號成功",
   "support.user.info.bind_notification_error": "綁定通知帳號異常",
+  "support.user.info.bind_notification_hint": "請綁定通知接收帳號，確保您能正常接收套餐過期提醒等通知，保障您的服務正常運作。",
+  "support.user.info.bind_notification_success": "綁定通知帳號成功",
+  "support.user.info.code_required": "驗證碼不能為空",
+  "support.user.info.notification_receiving_hint": "通知接收",
+  "support.user.info.verification_code": "驗證碼",
+  "support.user.inform.System message": "系統訊息",
   "support.user.login.Email": "電子郵件",
   "support.user.login.Github": "GitHub 登入",
   "support.user.login.Google": "Google 登入",

packages/web/i18n/zh-Hant/user.json

@@ -37,8 +37,6 @@
   "password.confirm": "確認密碼",
   "password.email_phone_error": "電子郵件/手機號碼格式錯誤",
   "password.email_phone_void": "電子郵件/手機號碼不能空白",
-  "password.get_code": "取得驗證碼",
-  "password.get_code_again": "秒後重新取得",
   "password.not_match": "兩次輸入的密碼不相符",
   "password.password_condition": "密碼長度需介於 4 至 20 字元之間",
   "password.password_required": "密碼不能空白",

projects/app/src/components/support/wallet/NotSufficientModal/index.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import MyModal from '@fastgpt/web/components/common/MyModal';
 import { useTranslation } from 'next-i18next';
 import { Box, Button, Flex, ModalBody, ModalFooter, useDisclosure } from '@chakra-ui/react';
@@ -71,7 +71,13 @@ const RechargeModal = ({
   onPaySuccess: () => void;
 }) => {
   const { t } = useTranslation();
-  const { teamPlanStatus } = useUserStore();
+  const { teamPlanStatus, initTeamPlanStatus } = useUserStore();
+
+  useEffect(() => {
+    (async () => {
+      await initTeamPlanStatus();
+    })();
+  }, [initTeamPlanStatus]);
 
   const planName = useMemo(() => {
     if (!teamPlanStatus?.standard?.currentSubLevel) return '';

projects/app/src/components/support/wallet/QRCodePayModal.tsx

@@ -7,6 +7,8 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import { useRouter } from 'next/router';
 import { getErrText } from '@fastgpt/global/common/error/utils';
 import LightTip from '@fastgpt/web/components/common/LightTip';
+import Script from 'next/script';
+import { getWebReqUrl } from '@fastgpt/web/common/system/utils';
 
 export type QRPayProps = {
   readPrice: number;
@@ -76,15 +78,19 @@ const QRCodePayModal = ({
   }, [billId, onSuccess, toast]);
 
   return (
-    <MyModal isOpen title={t('common:user.Pay')} iconSrc="/imgs/modal/pay.svg">
+    <>
-      <ModalBody textAlign={'center'} pb={10} whiteSpace={'pre-wrap'}>
+      <Script src={getWebReqUrl('/js/qrcode.min.js')} strategy="lazyOnload"></Script>
-        {tip && <LightTip text={tip} mb={8} textAlign={'left'} />}
+
-        <Box ref={dom} id={'payQRCode'} display={'inline-block'} h={`${qrCodeSize}px`}></Box>
+      <MyModal isOpen title={t('common:user.Pay')} iconSrc="/imgs/modal/pay.svg">
-        <Box mt={5} textAlign={'center'}>
+        <ModalBody textAlign={'center'} pb={10} whiteSpace={'pre-wrap'}>
-          {t('common:pay.wechat', { price: readPrice })}
+          {tip && <LightTip text={tip} mb={8} textAlign={'left'} />}
-        </Box>
+          <Box ref={dom} id={'payQRCode'} display={'inline-block'} h={`${qrCodeSize}px`}></Box>
-      </ModalBody>
+          <Box mt={5} textAlign={'center'}>
-    </MyModal>
+            {t('common:pay.wechat', { price: readPrice })}
+          </Box>
+        </ModalBody>
+      </MyModal>
+    </>
   );
 };
 

projects/app/src/pages/price/components/Standard.tsx

@@ -88,8 +88,14 @@ const Standard = ({
               {
                 label: (
                   <Flex>
-                    {t('common:support.wallet.subscription.mode.Year')}
+                    <Box whiteSpace={'nowrap'}>
-                    <Box ml={1} color={selectSubMode === SubModeEnum.month ? 'red.600' : 'auto'}>
+                      {t('common:support.wallet.subscription.mode.Year')}
+                    </Box>
+                    <Box
+                      whiteSpace={'nowrap'}
+                      ml={1}
+                      color={selectSubMode === SubModeEnum.month ? 'red.600' : 'auto'}
+                    >
                       ({t('common:support.wallet.subscription.mode.Year sale')})
                     </Box>
                   </Flex>

projects/app/src/pages/price/index.tsx

@@ -10,8 +10,6 @@ import ExtraPlan from './components/ExtraPlan';
 import PointsCard from './components/Points';
 import FAQ from './components/FAQ';
 import { getToken } from '@/web/support/user/auth';
-import Script from 'next/script';
-import { getWebReqUrl } from '@fastgpt/web/common/system/utils';
 import { useTranslation } from 'next-i18next';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
@@ -26,61 +24,53 @@ const PriceBox = () => {
   });
 
   return (
-    <>
+    <Flex
-      <Script src={getWebReqUrl('/js/qrcode.min.js')} strategy="lazyOnload"></Script>
+      h={'100%'}
-      <Flex
+      flexDir={'column'}
-        h={'100%'}
+      overflow={'overlay'}
-        flexDir={'column'}
+      w={'100%'}
-        overflow={'overlay'}
+      px={['20px', '5vw']}
-        w={'100%'}
+      py={['30px', '80px']}
-        px={['20px', '5vw']}
+      bg={`linear-gradient(to right, #F8F8FD00, #F7F7FF),url(/imgs/priceBg.svg)`}
-        py={['30px', '80px']}
+      backgroundSize={'cover'}
-        bg={`linear-gradient(to right, #F8F8FD00, #F7F7FF),url(/imgs/priceBg.svg)`}
+      backgroundRepeat={'no-repeat'}
-        backgroundSize={'cover'}
+    >
-        backgroundRepeat={'no-repeat'}
+      {/* standard sub */}
-      >
+      <VStack>
-        {/* standard sub */}
+        <Box fontWeight={'600'} color={'myGray.900'} fontSize={['24px', '36px']}>
-        <VStack>
+          {t('common:support.wallet.subscription.Sub plan')}
-          <Box fontWeight={'600'} color={'myGray.900'} fontSize={['24px', '36px']}>
+        </Box>
-            {t('common:support.wallet.subscription.Sub plan')}
+        <Box mt={8} mb={10} fontWeight={'500'} color={'myGray.600'} fontSize={'md'}>
+          {t('common:support.wallet.subscription.Sub plan tip', {
+            title: feConfigs?.systemTitle
+          })}
+        </Box>
+        <StandardPlan standardPlan={teamSubPlan?.standard} />
+        <HStack mt={8} color={'blue.700'} ml={8}>
+          <MyIcon name={'infoRounded'} w={'1rem'} />
+          <Box fontSize={'sm'} fontWeight={'500'}>
+            {t('user:bill.standard_valid_tip')}
           </Box>
-          <Box mt={8} mb={10} fontWeight={'500'} color={'myGray.600'} fontSize={'md'}>
+        </HStack>
-            {t('common:support.wallet.subscription.Sub plan tip', {
+      </VStack>
-              title: feConfigs?.systemTitle
-            })}
-          </Box>
-          <StandardPlan standardPlan={teamSubPlan?.standard} />
-          <HStack mt={8} color={'blue.700'} ml={8}>
-            <MyIcon name={'infoRounded'} w={'1rem'} />
-            <Box fontSize={'sm'} fontWeight={'500'}>
-              {t('user:bill.standard_valid_tip')}
-            </Box>
-          </HStack>
-        </VStack>
 
-        {/* extra plan */}
+      {/* extra plan */}
-        <VStack mt={['40px', '100px']} mb={8}>
+      <VStack mt={['40px', '100px']} mb={8}>
-          <Box
+        <Box id={'extra-plan'} fontWeight={'bold'} fontSize={['24px', '36px']} color={'myGray.900'}>
-            id={'extra-plan'}
+          {t('common:support.wallet.subscription.Extra plan')}
-            fontWeight={'bold'}
+        </Box>
-            fontSize={['24px', '36px']}
+        <Box mt={2} mb={8} color={'myGray.600'} fontSize={'md'}>
-            color={'myGray.900'}
+          {t('common:support.wallet.subscription.Extra plan tip')}
-          >
+        </Box>
-            {t('common:support.wallet.subscription.Extra plan')}
+        <ExtraPlan />
-          </Box>
+      </VStack>
-          <Box mt={2} mb={8} color={'myGray.600'} fontSize={'md'}>
-            {t('common:support.wallet.subscription.Extra plan tip')}
-          </Box>
-          <ExtraPlan />
-        </VStack>
 
-        {/* points */}
+      {/* points */}
-        <PointsCard />
+      <PointsCard />
 
-        {/* question */}
+      {/* question */}
-        <FAQ />
+      <FAQ />
-      </Flex>
+    </Flex>
-    </>
   );
 };
 

projects/app/src/web/support/user/hooks/useSendCode.tsx

@@ -43,12 +43,12 @@ export const useSendCode = ({ type }: { type: `${UserAuthTypeEnum}` }) => {
   const sendCodeText = useMemo(() => {
     if (codeSending) return t('common:support.user.auth.Sending Code');
     if (codeCountDown >= 10) {
-      return `${codeCountDown}${t('user:password.get_code_again')}`;
+      return `${codeCountDown}${t('common:support.user.auth.get_code_again')}`;
     }
     if (codeCountDown > 0) {
-      return `0${codeCountDown}${t('user:password.get_code_again')}`;
+      return `0${codeCountDown}${t('common:support.user.auth.get_code_again')}`;
     }
-    return t('user:password.get_code');
+    return t('common:support.user.auth.get_code');
   }, [codeCountDown, codeSending, t]);
 
   const {