feat: i18n support

web/default/src/pages/Setting/index.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import { Card, Tab } from 'semantic-ui-react';
 import SystemSetting from '../../components/SystemSetting';
 import { isRoot } from '../../helpers';
@@ -7,9 +8,11 @@ import PersonalSetting from '../../components/PersonalSetting';
 import OperationSetting from '../../components/OperationSetting';
 
 const Setting = () => {
+  const { t } = useTranslation();
+
   let panes = [
     {
-      menuItem: '个人设置',
+      menuItem: t('setting.tabs.personal'),
       render: () => (
         <Tab.Pane attached={false}>
           <PersonalSetting />
@@ -20,7 +23,7 @@ const Setting = () => {
 
   if (isRoot()) {
     panes.push({
-      menuItem: '运营设置',
+      menuItem: t('setting.tabs.operation'),
       render: () => (
         <Tab.Pane attached={false}>
           <OperationSetting />
@@ -28,7 +31,7 @@ const Setting = () => {
       ),
     });
     panes.push({
-      menuItem: '系统设置',
+      menuItem: t('setting.tabs.system'),
       render: () => (
         <Tab.Pane attached={false}>
           <SystemSetting />
@@ -36,7 +39,7 @@ const Setting = () => {
       ),
     });
     panes.push({
-      menuItem: '其他设置',
+      menuItem: t('setting.tabs.other'),
       render: () => (
         <Tab.Pane attached={false}>
           <OtherSetting />
@@ -49,12 +52,12 @@ const Setting = () => {
     <div className='dashboard-container'>
       <Card fluid className='chart-card'>
         <Card.Content>
-          <Card.Header className='header'>系统设置</Card.Header>
+          <Card.Header className='header'>{t('setting.title')}</Card.Header>
           <Tab
             menu={{
               secondary: true,
               pointing: true,
-              className: 'settings-tab', // 添加自定义类名以便样式化
+              className: 'settings-tab',
             }}
             panes={panes}
           />