From 2f28f57d78eae29866fafe5c1ff753b8e4ca7aea Mon Sep 17 00:00:00 2001 From: jingyang <3161362058@qq.com> Date: Wed, 2 Aug 2023 10:50:38 +0800 Subject: [PATCH] feat translation of the user module Signed-off-by: jingyang <3161362058@qq.com> --- client/public/locales/en/common.json | 19 ++++++++-- client/public/locales/zh/common.json | 19 ++++++++-- client/src/components/SideTabs/index.tsx | 4 ++- .../pages/account/components/BillTable.tsx | 11 +++--- client/src/pages/account/components/Info.tsx | 15 ++++---- client/src/pages/account/index.tsx | 35 ++++++++++++++++--- .../pages/kb/detail/components/Import/Csv.tsx | 3 +- .../detail/components/Import/FileSelect.tsx | 30 +++++++++++++++- 8 files changed, 111 insertions(+), 25 deletions(-) diff --git a/client/public/locales/en/common.json b/client/public/locales/en/common.json index d6c63f0a6..3c27c637f 100644 --- a/client/public/locales/en/common.json +++ b/client/public/locales/en/common.json @@ -39,6 +39,21 @@ "Set OpenAI Account Failed": "Set OpenAI account failed", "Update Password": "Update Password", "Update password failed": "Update password failed", - "Update password succseful": "Update password succseful" + "Update password succseful": "Update password succseful", + "Personal Information": "Personal", + "Usage Record": "Usage", + "Recharge Record": "Recharge", + "Notice": "Notice", + "Sign Out": "Sign Out", + "Avatar": "Avatar", + "Account": "Account", + "Balance": "Balance", + "Time": "Time", + "Source": "Source", + "Application Name": "Application Name", + "Total Amount": "Total Amount", + "Change": "Change", + "Password": "Password", + "Replace": "Replace" } -} +} \ No newline at end of file diff --git a/client/public/locales/zh/common.json b/client/public/locales/zh/common.json index e2b7b0a77..f3359312c 100644 --- a/client/public/locales/zh/common.json +++ b/client/public/locales/zh/common.json @@ -39,6 +39,21 @@ "Set OpenAI Account Failed": "设置 OpenAI 账号异常", "Update Password": "修改密码", "Update password failed": "修改密码异常", - "Update password succseful": "修改密码成功" + "Update password succseful": "修改密码成功", + "Personal Information": "个人信息", + "Usage Record": "使用记录", + "Recharge Record": "充值记录", + "Notice": "通知", + "Sign Out": "登出", + "Avatar": "头像", + "Account": "账号", + "Balance": "余额", + "Time": "时间", + "Source": "来源", + "Application Name": "应用名", + "Total Amount": "总金额", + "Change": "变更", + "Password": "密码", + "Replace": "更换" } -} +} \ No newline at end of file diff --git a/client/src/components/SideTabs/index.tsx b/client/src/components/SideTabs/index.tsx index 34f7ba24e..698ee679f 100644 --- a/client/src/components/SideTabs/index.tsx +++ b/client/src/components/SideTabs/index.tsx @@ -2,6 +2,7 @@ import React, { useMemo } from 'react'; import { Box, Flex, useTheme } from '@chakra-ui/react'; import type { GridProps } from '@chakra-ui/react'; import MyIcon, { type IconName } from '../Icon'; +import { useTranslation } from 'next-i18next'; // @ts-ignore export interface Props extends GridProps { @@ -12,6 +13,7 @@ export interface Props extends GridProps { } const SideTabs = ({ list, size = 'md', activeId, onChange, ...props }: Props) => { + const { t } = useTranslation(); const sizeMap = useMemo(() => { switch (size) { case 'sm': @@ -61,7 +63,7 @@ const SideTabs = ({ list, size = 'md', activeId, onChange, ...props }: Props) => }} > - {item.label} + {t(item.label)} ))} diff --git a/client/src/pages/account/components/BillTable.tsx b/client/src/pages/account/components/BillTable.tsx index 88b29c4cb..9a5190a12 100644 --- a/client/src/pages/account/components/BillTable.tsx +++ b/client/src/pages/account/components/BillTable.tsx @@ -22,10 +22,11 @@ import DateRangePicker, { type DateRangeType } from '@/components/DateRangePicke import { addDays } from 'date-fns'; import dynamic from 'next/dynamic'; import { useGlobalStore } from '@/store/global'; - +import { useTranslation } from 'next-i18next'; const BillDetail = dynamic(() => import('./BillDetail')); const BillTable = () => { + const { t } = useTranslation(); const { Loading } = useLoading(); const [dateRange, setDateRange] = useState({ from: addDays(new Date(), -7), @@ -55,10 +56,10 @@ const BillTable = () => { - - - - + + + + diff --git a/client/src/pages/account/components/Info.tsx b/client/src/pages/account/components/Info.tsx index f63a43fbf..a6b911737 100644 --- a/client/src/pages/account/components/Info.tsx +++ b/client/src/pages/account/components/Info.tsx @@ -10,8 +10,7 @@ import dynamic from 'next/dynamic'; import { useSelectFile } from '@/hooks/useSelectFile'; import { compressImg } from '@/utils/file'; import { feConfigs } from '@/store/static'; -import { useTranslation } from 'react-i18next'; - +import { useTranslation } from 'next-i18next'; import Loading from '@/components/Loading'; import Avatar from '@/components/Avatar'; import MyIcon from '@/components/Icon'; @@ -125,7 +124,7 @@ const UserInfo = () => { - 更换 + {t('user.Replace')} { mt={[6, 0]} > - 账号: + {t('user.Account')}:  {userInfo?.username} - 密码: + {t('user.Password')}:  ***** {feConfigs?.show_userDetail && ( <> - 余额: + {t('user.Balance')}:  {userInfo?.balance.toFixed(3)} 元 diff --git a/client/src/pages/account/index.tsx b/client/src/pages/account/index.tsx index 02415f377..106440e47 100644 --- a/client/src/pages/account/index.tsx +++ b/client/src/pages/account/index.tsx @@ -32,11 +32,36 @@ enum TabEnum { const Account = ({ currentTab }: { currentTab: `${TabEnum}` }) => { const tabList = useRef([ - { icon: 'meLight', label: '个人信息', id: TabEnum.info, Component: }, - { icon: 'billRecordLight', label: '使用记录', id: TabEnum.bill, Component: }, - { icon: 'payRecordLight', label: '充值记录', id: TabEnum.pay, Component: }, - { icon: 'informLight', label: '通知', id: TabEnum.inform, Component: }, - { icon: 'loginoutLight', label: '登出', id: TabEnum.loginout, Component: () => <> } + { + icon: 'meLight', + label: 'user.Personal Information', + id: TabEnum.info, + Component: + }, + { + icon: 'billRecordLight', + label: 'user.Usage Record', + id: TabEnum.bill, + Component: + }, + { + icon: 'payRecordLight', + label: 'user.Recharge Record', + id: TabEnum.pay, + Component: + }, + { + icon: 'informLight', + label: 'user.Notice', + id: TabEnum.inform, + Component: + }, + { + icon: 'loginoutLight', + label: 'user.Sign Out', + id: TabEnum.loginout, + Component: () => <> + } ]); const { openConfirm, ConfirmModal } = useConfirm({ diff --git a/client/src/pages/kb/detail/components/Import/Csv.tsx b/client/src/pages/kb/detail/components/Import/Csv.tsx index aa0d46f27..169bbfb3d 100644 --- a/client/src/pages/kb/detail/components/Import/Csv.tsx +++ b/client/src/pages/kb/detail/components/Import/Csv.tsx @@ -13,7 +13,7 @@ import { TrainingModeEnum } from '@/constants/plugin'; import FileSelect from './FileSelect'; import { useRouter } from 'next/router'; const nanoid = customAlphabet('abcdefghijklmnopqrstuvwxyz1234567890', 12); -import { readCsvContent } from '@/utils/file'; +import { fileDownload, readCsvContent } from '@/utils/file'; const fileExtension = '.csv'; @@ -137,6 +137,7 @@ const CsvImport = ({ kbId }: { kbId: string }) => { isLoading={selecting} tipText={'如果导入文件乱码，请将 CSV 转成 utf-8 编码格式'} py={emptyFiles ? '100px' : 5} + isCsv /> {!emptyFiles && ( diff --git a/client/src/pages/kb/detail/components/Import/FileSelect.tsx b/client/src/pages/kb/detail/components/Import/FileSelect.tsx index d3fafd441..d190efcbc 100644 --- a/client/src/pages/kb/detail/components/Import/FileSelect.tsx +++ b/client/src/pages/kb/detail/components/Import/FileSelect.tsx @@ -4,16 +4,26 @@ import { useLoading } from '@/hooks/useLoading'; import { useSelectFile } from '@/hooks/useSelectFile'; import MyIcon from '@/components/Icon'; +import { fileDownload } from '@/utils/file'; interface Props extends BoxProps { fileExtension: string; tipText?: string; onSelectFile: (files: File[]) => Promise; isLoading?: boolean; + isCsv?: boolean; } -const FileSelect = ({ fileExtension, onSelectFile, isLoading, tipText, ...props }: Props) => { +const FileSelect = ({ + fileExtension, + onSelectFile, + isLoading, + tipText, + isCsv = false, + ...props +}: Props) => { const { Loading: FileSelectLoading } = useLoading(); + const csvTemplate = `question,answer\n"什么是 laf","laf 是一个云函数开发平台……"\n"什么是 sealos","Sealos 是以 kubernetes 为内核的云操作系统发行版,可以……"`; const { File, onOpen } = useSelectFile({ fileType: fileExtension, @@ -47,6 +57,24 @@ const FileSelect = ({ fileExtension, onSelectFile, isLoading, tipText, ...props {tipText} )} + {isCsv && ( + + fileDownload({ + text: csvTemplate, + type: 'text/csv', + filename: 'template.csv' + }) + } + > + 点击下载csv模板 + + )}
时间来源应用名总金额{t('user.Time')}{t('user.Source')}{t('user.Application Name')}{t('user.Total Amount')}